@ -0,0 +1,12 @@
|
||||
{
|
||||
"name": "UberspaceServer",
|
||||
"host": "185.26.156.129",
|
||||
"protocol": "sftp",
|
||||
"port": 22,
|
||||
"username": "m0nk3y",
|
||||
"password": "MsshSZfM0nk3y",
|
||||
"remotePath": "/var/www/virtual/m0nk3y/home/public",
|
||||
"uploadOnSave": true,
|
||||
"useTempFile": false,
|
||||
"openSsh": false
|
||||
}
|
||||
@ -0,0 +1,936 @@
|
||||
/* Deafult Margin & Padding */
|
||||
/*-- Margin Top --*/
|
||||
.mt-5 {
|
||||
margin-top: 5px;
|
||||
}
|
||||
.mt-10 {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.mt-15 {
|
||||
margin-top: 15px;
|
||||
}
|
||||
.mt-20 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.mt-25 {
|
||||
margin-top: 25px;
|
||||
}
|
||||
.mt-30 {
|
||||
margin-top: 30px;
|
||||
}
|
||||
.mt-35 {
|
||||
margin-top: 35px;
|
||||
}
|
||||
.mt-40 {
|
||||
margin-top: 40px;
|
||||
}
|
||||
.mt-45 {
|
||||
margin-top: 45px;
|
||||
}
|
||||
.mt-50 {
|
||||
margin-top: 50px;
|
||||
}
|
||||
.mt-55 {
|
||||
margin-top: 55px;
|
||||
}
|
||||
.mt-60 {
|
||||
margin-top: 60px;
|
||||
}
|
||||
.mt-65 {
|
||||
margin-top: 65px;
|
||||
}
|
||||
.mt-70 {
|
||||
margin-top: 70px;
|
||||
}
|
||||
.mt-75 {
|
||||
margin-top: 75px;
|
||||
}
|
||||
.mt-80 {
|
||||
margin-top: 80px;
|
||||
}
|
||||
.mt-85 {
|
||||
margin-top: 85px;
|
||||
}
|
||||
.mt-90 {
|
||||
margin-top: 90px;
|
||||
}
|
||||
.mt-95 {
|
||||
margin-top: 95px;
|
||||
}
|
||||
.mt-100 {
|
||||
margin-top: 100px;
|
||||
}
|
||||
.mt-105 {
|
||||
margin-top: 105px;
|
||||
}
|
||||
.mt-110 {
|
||||
margin-top: 110px;
|
||||
}
|
||||
.mt-115 {
|
||||
margin-top: 115px;
|
||||
}
|
||||
.mt-120 {
|
||||
margin-top: 120px;
|
||||
}
|
||||
.mt-125 {
|
||||
margin-top: 125px;
|
||||
}
|
||||
.mt-130 {
|
||||
margin-top: 130px;
|
||||
}
|
||||
.mt-135 {
|
||||
margin-top: 135px;
|
||||
}
|
||||
.mt-140 {
|
||||
margin-top: 140px;
|
||||
}
|
||||
.mt-145 {
|
||||
margin-top: 145px;
|
||||
}
|
||||
.mt-150 {
|
||||
margin-top: 150px;
|
||||
}
|
||||
.mt-155 {
|
||||
margin-top: 155px;
|
||||
}
|
||||
.mt-160 {
|
||||
margin-top: 160px;
|
||||
}
|
||||
.mt-165 {
|
||||
margin-top: 165px;
|
||||
}
|
||||
.mt-170 {
|
||||
margin-top: 170px;
|
||||
}
|
||||
.mt-175 {
|
||||
margin-top: 175px;
|
||||
}
|
||||
.mt-180 {
|
||||
margin-top: 180px;
|
||||
}
|
||||
.mt-185 {
|
||||
margin-top: 185px;
|
||||
}
|
||||
.mt-190 {
|
||||
margin-top: 190px;
|
||||
}
|
||||
.mt-195 {
|
||||
margin-top: 195px;
|
||||
}
|
||||
.mt-200 {
|
||||
margin-top: 200px;
|
||||
}
|
||||
/*-- Margin Bottom --*/
|
||||
|
||||
.mb-5 {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.mb-10 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.mb-15 {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.mb-20 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.mb-25 {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
.mb-30 {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.mb-35 {
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
.mb-40 {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.mb-45 {
|
||||
margin-bottom: 45px;
|
||||
}
|
||||
.mb-50 {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.mb-55 {
|
||||
margin-bottom: 55px;
|
||||
}
|
||||
.mb-60 {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
.mb-65 {
|
||||
margin-bottom: 65px;
|
||||
}
|
||||
.mb-70 {
|
||||
margin-bottom: 70px;
|
||||
}
|
||||
.mb-75 {
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
.mb-80 {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
.mb-85 {
|
||||
margin-bottom: 85px;
|
||||
}
|
||||
.mb-90 {
|
||||
margin-bottom: 90px;
|
||||
}
|
||||
.mb-95 {
|
||||
margin-bottom: 95px;
|
||||
}
|
||||
.mb-100 {
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
.mb-105 {
|
||||
margin-bottom: 105px;
|
||||
}
|
||||
.mb-110 {
|
||||
margin-bottom: 110px;
|
||||
}
|
||||
.mb-115 {
|
||||
margin-bottom: 115px;
|
||||
}
|
||||
.mb-120 {
|
||||
margin-bottom: 120px;
|
||||
}
|
||||
.mb-125 {
|
||||
margin-bottom: 125px;
|
||||
}
|
||||
.mb-130 {
|
||||
margin-bottom: 130px;
|
||||
}
|
||||
.mb-135 {
|
||||
margin-bottom: 135px;
|
||||
}
|
||||
.mb-140 {
|
||||
margin-bottom: 140px;
|
||||
}
|
||||
.mb-145 {
|
||||
margin-bottom: 145px;
|
||||
}
|
||||
.mb-150 {
|
||||
margin-bottom: 150px;
|
||||
}
|
||||
.mb-155 {
|
||||
margin-bottom: 155px;
|
||||
}
|
||||
.mb-160 {
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
.mb-165 {
|
||||
margin-bottom: 165px;
|
||||
}
|
||||
.mb-170 {
|
||||
margin-bottom: 170px;
|
||||
}
|
||||
.mb-175 {
|
||||
margin-bottom: 175px;
|
||||
}
|
||||
.mb-180 {
|
||||
margin-bottom: 180px;
|
||||
}
|
||||
.mb-185 {
|
||||
margin-bottom: 185px;
|
||||
}
|
||||
.mb-190 {
|
||||
margin-bottom: 190px;
|
||||
}
|
||||
.mb-195 {
|
||||
margin-bottom: 195px;
|
||||
}
|
||||
.mb-200 {
|
||||
margin-bottom: 200px;
|
||||
}
|
||||
/*-- margin left --*/
|
||||
.ml-5 {
|
||||
margin-left: 5px;
|
||||
}
|
||||
.ml-10 {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.ml-15 {
|
||||
margin-left: 15px;
|
||||
}
|
||||
.ml-20 {
|
||||
margin-left: 20px;
|
||||
}
|
||||
.ml-25 {
|
||||
margin-left: 25px;
|
||||
}
|
||||
.ml-30 {
|
||||
margin-left: 30px;
|
||||
}
|
||||
.ml-35 {
|
||||
margin-left: 35px;
|
||||
}
|
||||
.ml-40 {
|
||||
margin-left: 40px;
|
||||
}
|
||||
.ml-45 {
|
||||
margin-left: 45px;
|
||||
}
|
||||
.ml-50 {
|
||||
margin-left: 50px;
|
||||
}
|
||||
.ml-55 {
|
||||
margin-left: 55px;
|
||||
}
|
||||
.ml-60 {
|
||||
margin-left: 60px;
|
||||
}
|
||||
.ml-65 {
|
||||
margin-left: 65px;
|
||||
}
|
||||
.ml-70 {
|
||||
margin-left: 70px;
|
||||
}
|
||||
.ml-75 {
|
||||
margin-left: 75px;
|
||||
}
|
||||
.ml-80 {
|
||||
margin-left: 80px;
|
||||
}
|
||||
.ml-85 {
|
||||
margin-left: 85px;
|
||||
}
|
||||
.ml-90 {
|
||||
margin-left: 90px;
|
||||
}
|
||||
.ml-95 {
|
||||
margin-left: 95px;
|
||||
}
|
||||
.ml-100 {
|
||||
margin-left: 100px;
|
||||
}
|
||||
.ml-105 {
|
||||
margin-left: 105px;
|
||||
}
|
||||
.ml-110 {
|
||||
margin-left: 110px;
|
||||
}
|
||||
.ml-115 {
|
||||
margin-left: 115px;
|
||||
}
|
||||
.ml-120 {
|
||||
margin-left: 120px;
|
||||
}
|
||||
.ml-125 {
|
||||
margin-left: 125px;
|
||||
}
|
||||
.ml-130 {
|
||||
margin-left: 130px;
|
||||
}
|
||||
.ml-135 {
|
||||
margin-left: 135px;
|
||||
}
|
||||
.ml-140 {
|
||||
margin-left: 140px;
|
||||
}
|
||||
.ml-145 {
|
||||
margin-left: 145px;
|
||||
}
|
||||
.ml-150 {
|
||||
margin-left: 150px;
|
||||
}
|
||||
.ml-155 {
|
||||
margin-left: 155px;
|
||||
}
|
||||
.ml-160 {
|
||||
margin-left: 160px;
|
||||
}
|
||||
.ml-165 {
|
||||
margin-left: 165px;
|
||||
}
|
||||
.ml-170 {
|
||||
margin-left: 170px;
|
||||
}
|
||||
.ml-175 {
|
||||
margin-left: 175px;
|
||||
}
|
||||
.ml-180 {
|
||||
margin-left: 180px;
|
||||
}
|
||||
.ml-185 {
|
||||
margin-left: 185px;
|
||||
}
|
||||
.ml-190 {
|
||||
margin-left: 190px;
|
||||
}
|
||||
.ml-195 {
|
||||
margin-left: 195px;
|
||||
}
|
||||
.ml-200 {
|
||||
margin-left: 200px;
|
||||
}
|
||||
/*-- margin right --*/
|
||||
.mr-5 {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.mr-10 {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.mr-15 {
|
||||
margin-right: 15px;
|
||||
}
|
||||
.mr-20 {
|
||||
margin-right: 20px;
|
||||
}
|
||||
.mr-25 {
|
||||
margin-right: 25px;
|
||||
}
|
||||
.mr-30 {
|
||||
margin-right: 30px;
|
||||
}
|
||||
.mr-35 {
|
||||
margin-right: 35px;
|
||||
}
|
||||
.mr-40 {
|
||||
margin-right: 40px;
|
||||
}
|
||||
.mr-45 {
|
||||
margin-right: 45px;
|
||||
}
|
||||
.mr-50 {
|
||||
margin-right: 50px;
|
||||
}
|
||||
.mr-55 {
|
||||
margin-right: 55px;
|
||||
}
|
||||
.mr-60 {
|
||||
margin-right: 60px;
|
||||
}
|
||||
.mr-65 {
|
||||
margin-right: 65px;
|
||||
}
|
||||
.mr-70 {
|
||||
margin-right: 70px;
|
||||
}
|
||||
.mr-75 {
|
||||
margin-right: 75px;
|
||||
}
|
||||
.mr-80 {
|
||||
margin-right: 80px;
|
||||
}
|
||||
.mr-85 {
|
||||
margin-right: 85px;
|
||||
}
|
||||
.mr-90 {
|
||||
margin-right: 90px;
|
||||
}
|
||||
.mr-95 {
|
||||
margin-right: 95px;
|
||||
}
|
||||
.mr-100 {
|
||||
margin-right: 100px;
|
||||
}
|
||||
.mr-105 {
|
||||
margin-right: 105px;
|
||||
}
|
||||
.mr-110 {
|
||||
margin-right: 110px;
|
||||
}
|
||||
.mr-115 {
|
||||
margin-right: 115px;
|
||||
}
|
||||
.mr-120 {
|
||||
margin-right: 120px;
|
||||
}
|
||||
.mr-125 {
|
||||
margin-right: 125px;
|
||||
}
|
||||
.mr-130 {
|
||||
margin-right: 130px;
|
||||
}
|
||||
.mr-135 {
|
||||
margin-right: 135px;
|
||||
}
|
||||
.mr-140 {
|
||||
margin-right: 140px;
|
||||
}
|
||||
.mr-145 {
|
||||
margin-right: 145px;
|
||||
}
|
||||
.mr-150 {
|
||||
margin-right: 150px;
|
||||
}
|
||||
.mr-155 {
|
||||
margin-right: 155px;
|
||||
}
|
||||
.mr-160 {
|
||||
margin-right: 160px;
|
||||
}
|
||||
.mr-165 {
|
||||
margin-right: 165px;
|
||||
}
|
||||
.mr-170 {
|
||||
margin-right: 170px;
|
||||
}
|
||||
.mr-175 {
|
||||
margin-right: 175px;
|
||||
}
|
||||
.mr-180 {
|
||||
margin-right: 180px;
|
||||
}
|
||||
.mr-185 {
|
||||
margin-right: 185px;
|
||||
}
|
||||
.mr-190 {
|
||||
margin-right: 190px;
|
||||
}
|
||||
.mr-195 {
|
||||
margin-right: 195px;
|
||||
}
|
||||
.mr-200 {
|
||||
margin-right: 200px;
|
||||
}
|
||||
|
||||
|
||||
/*-- Padding Top --*/
|
||||
|
||||
.pt-5 {
|
||||
padding-top: 5px;
|
||||
}
|
||||
.pt-10 {
|
||||
padding-top: 10px;
|
||||
}
|
||||
.pt-15 {
|
||||
padding-top: 15px;
|
||||
}
|
||||
.pt-20 {
|
||||
padding-top: 20px;
|
||||
}
|
||||
.pt-25 {
|
||||
padding-top: 25px;
|
||||
}
|
||||
.pt-30 {
|
||||
padding-top: 30px;
|
||||
}
|
||||
.pt-35 {
|
||||
padding-top: 35px;
|
||||
}
|
||||
.pt-40 {
|
||||
padding-top: 40px;
|
||||
}
|
||||
.pt-45 {
|
||||
padding-top: 45px;
|
||||
}
|
||||
.pt-50 {
|
||||
padding-top: 50px;
|
||||
}
|
||||
.pt-55 {
|
||||
padding-top: 55px;
|
||||
}
|
||||
.pt-60 {
|
||||
padding-top: 60px;
|
||||
}
|
||||
.pt-65 {
|
||||
padding-top: 65px;
|
||||
}
|
||||
.pt-70 {
|
||||
padding-top: 70px;
|
||||
}
|
||||
.pt-75 {
|
||||
padding-top: 75px;
|
||||
}
|
||||
.pt-80 {
|
||||
padding-top: 80px;
|
||||
}
|
||||
.pt-85 {
|
||||
padding-top: 85px;
|
||||
}
|
||||
.pt-90 {
|
||||
padding-top: 90px;
|
||||
}
|
||||
.pt-95 {
|
||||
padding-top: 95px;
|
||||
}
|
||||
.pt-100 {
|
||||
padding-top: 100px;
|
||||
}
|
||||
.pt-105 {
|
||||
padding-top: 105px;
|
||||
}
|
||||
.pt-110 {
|
||||
padding-top: 110px;
|
||||
}
|
||||
.pt-115 {
|
||||
padding-top: 115px;
|
||||
}
|
||||
.pt-120 {
|
||||
padding-top: 120px;
|
||||
}
|
||||
.pt-125 {
|
||||
padding-top: 125px;
|
||||
}
|
||||
.pt-130 {
|
||||
padding-top: 130px;
|
||||
}
|
||||
.pt-135 {
|
||||
padding-top: 135px;
|
||||
}
|
||||
.pt-140 {
|
||||
padding-top: 140px;
|
||||
}
|
||||
.pt-145 {
|
||||
padding-top: 145px;
|
||||
}
|
||||
.pt-150 {
|
||||
padding-top: 150px;
|
||||
}
|
||||
.pt-155 {
|
||||
padding-top: 155px;
|
||||
}
|
||||
.pt-160 {
|
||||
padding-top: 160px;
|
||||
}
|
||||
.pt-165 {
|
||||
padding-top: 165px;
|
||||
}
|
||||
.pt-170 {
|
||||
padding-top: 170px;
|
||||
}
|
||||
.pt-175 {
|
||||
padding-top: 175px;
|
||||
}
|
||||
.pt-180 {
|
||||
padding-top: 180px;
|
||||
}
|
||||
.pt-185 {
|
||||
padding-top: 185px;
|
||||
}
|
||||
.pt-190 {
|
||||
padding-top: 190px;
|
||||
}
|
||||
.pt-195 {
|
||||
padding-top: 195px;
|
||||
}
|
||||
.pt-200 {
|
||||
padding-top: 200px;
|
||||
}
|
||||
/*-- Padding Bottom --*/
|
||||
|
||||
.pb-5 {
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.pb-10 {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.pb-15 {
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
.pb-20 {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.pb-25 {
|
||||
padding-bottom: 25px;
|
||||
}
|
||||
.pb-30 {
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
.pb-35 {
|
||||
padding-bottom: 35px;
|
||||
}
|
||||
.pb-40 {
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
.pb-45 {
|
||||
padding-bottom: 45px;
|
||||
}
|
||||
.pb-50 {
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
.pb-55 {
|
||||
padding-bottom: 55px;
|
||||
}
|
||||
.pb-60 {
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
.pb-65 {
|
||||
padding-bottom: 65px;
|
||||
}
|
||||
.pb-70 {
|
||||
padding-bottom: 70px;
|
||||
}
|
||||
.pb-75 {
|
||||
padding-bottom: 75px;
|
||||
}
|
||||
.pb-80 {
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
.pb-85 {
|
||||
padding-bottom: 85px;
|
||||
}
|
||||
.pb-90 {
|
||||
padding-bottom: 90px;
|
||||
}
|
||||
.pb-95 {
|
||||
padding-bottom: 95px;
|
||||
}
|
||||
.pb-100 {
|
||||
padding-bottom: 100px;
|
||||
}
|
||||
.pb-105 {
|
||||
padding-bottom: 105px;
|
||||
}
|
||||
.pb-110 {
|
||||
padding-bottom: 110px;
|
||||
}
|
||||
.pb-115 {
|
||||
padding-bottom: 115px;
|
||||
}
|
||||
.pb-120 {
|
||||
padding-bottom: 120px;
|
||||
}
|
||||
.pb-125 {
|
||||
padding-bottom: 125px;
|
||||
}
|
||||
.pb-130 {
|
||||
padding-bottom: 130px;
|
||||
}
|
||||
.pb-135 {
|
||||
padding-bottom: 135px;
|
||||
}
|
||||
.pb-140 {
|
||||
padding-bottom: 140px;
|
||||
}
|
||||
.pb-145 {
|
||||
padding-bottom: 145px;
|
||||
}
|
||||
.pb-150 {
|
||||
padding-bottom: 150px;
|
||||
}
|
||||
.pb-155 {
|
||||
padding-bottom: 155px;
|
||||
}
|
||||
.pb-160 {
|
||||
padding-bottom: 160px;
|
||||
}
|
||||
.pb-165 {
|
||||
padding-bottom: 165px;
|
||||
}
|
||||
.pb-170 {
|
||||
padding-bottom: 170px;
|
||||
}
|
||||
.pb-175 {
|
||||
padding-bottom: 175px;
|
||||
}
|
||||
.pb-180 {
|
||||
padding-bottom: 180px;
|
||||
}
|
||||
.pb-185 {
|
||||
padding-bottom: 185px;
|
||||
}
|
||||
.pb-190 {
|
||||
padding-bottom: 190px;
|
||||
}
|
||||
.pb-195 {
|
||||
padding-bottom: 195px;
|
||||
}
|
||||
.pb-200 {
|
||||
padding-bottom: 200px;
|
||||
}
|
||||
|
||||
/*-- Padding left --*/
|
||||
|
||||
.pl-0 {
|
||||
padding-left: 0px;
|
||||
}
|
||||
.pl-5 {
|
||||
padding-left: 5px;
|
||||
}
|
||||
.pl-10 {
|
||||
padding-left: 10px;
|
||||
}
|
||||
.pl-15 {
|
||||
padding-left: 15px;
|
||||
}
|
||||
.pl-20 {
|
||||
padding-left: 20px;
|
||||
}
|
||||
.pl-25 {
|
||||
padding-left: 25px;
|
||||
}
|
||||
.pl-30 {
|
||||
padding-left: 30px;
|
||||
}
|
||||
.pl-35 {
|
||||
padding-left: 35px;
|
||||
}
|
||||
.pl-40 {
|
||||
padding-left: 40px;
|
||||
}
|
||||
.pl-45 {
|
||||
padding-left: 45px;
|
||||
}
|
||||
.pl-50 {
|
||||
padding-left: 50px;
|
||||
}
|
||||
.pl-55 {
|
||||
padding-left: 55px;
|
||||
}
|
||||
.pl-60 {
|
||||
padding-left: 60px;
|
||||
}
|
||||
.pl-65 {
|
||||
padding-left: 65px;
|
||||
}
|
||||
.pl-70 {
|
||||
padding-left: 70px;
|
||||
}
|
||||
.pl-75 {
|
||||
padding-left: 75px;
|
||||
}
|
||||
.pl-80 {
|
||||
padding-left: 80px;
|
||||
}
|
||||
.pl-85 {
|
||||
padding-left: 85px;
|
||||
}
|
||||
.pl-90 {
|
||||
padding-left: 90px;
|
||||
}
|
||||
.pl-100 {
|
||||
padding-left: 100px;
|
||||
}
|
||||
.pl-105 {
|
||||
padding-left: 105px;
|
||||
}
|
||||
.pl-110 {
|
||||
padding-left: 110px;
|
||||
}
|
||||
.pl-115 {
|
||||
padding-left: 115px;
|
||||
}
|
||||
.pl-120 {
|
||||
padding-left: 120px;
|
||||
}
|
||||
.pl-125 {
|
||||
padding-left: 125px;
|
||||
}
|
||||
/*-- Padding right --*/
|
||||
|
||||
.pr-0 {
|
||||
padding-right: 0px;
|
||||
}
|
||||
.pr-5 {
|
||||
padding-right: 5px;
|
||||
}
|
||||
.pr-10 {
|
||||
padding-right: 10px;
|
||||
}
|
||||
.pr-15 {
|
||||
padding-right: 15px;
|
||||
}
|
||||
.pr-20 {
|
||||
padding-right: 20px;
|
||||
}
|
||||
.pr-25 {
|
||||
padding-right: 25px;
|
||||
}
|
||||
.pr-30 {
|
||||
padding-right: 30px;
|
||||
}
|
||||
.pr-35 {
|
||||
padding-right: 35px;
|
||||
}
|
||||
.pr-40 {
|
||||
padding-right: 40px;
|
||||
}
|
||||
.pr-45 {
|
||||
padding-right: 45px;
|
||||
}
|
||||
.pr-50 {
|
||||
padding-right: 50px;
|
||||
}
|
||||
.pr-55 {
|
||||
padding-right: 55px;
|
||||
}
|
||||
.pr-60 {
|
||||
padding-right: 60px;
|
||||
}
|
||||
.pr-65 {
|
||||
padding-right: 65px;
|
||||
}
|
||||
.pr-70 {
|
||||
padding-right: 70px;
|
||||
}
|
||||
.pr-75 {
|
||||
padding-right: 75px;
|
||||
}
|
||||
.pr-80 {
|
||||
padding-right: 80px;
|
||||
}
|
||||
.pr-85 {
|
||||
padding-right: 85px;
|
||||
}
|
||||
.pr-90 {
|
||||
padding-right: 90px;
|
||||
}
|
||||
.pr-95 {
|
||||
padding-right: 95px;
|
||||
}
|
||||
.pr-100 {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.pr-105 {
|
||||
padding-right: 105px;
|
||||
}
|
||||
/* Background Color */
|
||||
|
||||
.gray-bg {
|
||||
background: #fbfbfb;
|
||||
}
|
||||
.white-bg {
|
||||
background: #fff;
|
||||
}
|
||||
.black-bg {
|
||||
background: #222;
|
||||
}
|
||||
/* Color */
|
||||
|
||||
.white {
|
||||
color: #fff;
|
||||
}
|
||||
.black {
|
||||
color: #222;
|
||||
}
|
||||
/* black overlay */
|
||||
|
||||
[data-overlay] {
|
||||
position: relative;
|
||||
}
|
||||
[data-overlay]::before {
|
||||
background: #000 none repeat scroll 0 0;
|
||||
content: "";
|
||||
height: 100%;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
[data-overlay="2"]::before {
|
||||
opacity: 0.2;
|
||||
}
|
||||
[data-overlay="3"]::before {
|
||||
opacity: 0.3;
|
||||
}
|
||||
[data-overlay="4"]::before {
|
||||
opacity: 0.4;
|
||||
}
|
||||
[data-overlay="5"]::before {
|
||||
opacity: 0.5;
|
||||
}
|
||||
[data-overlay="6"]::before {
|
||||
opacity: 0.6;
|
||||
}
|
||||
[data-overlay="7"]::before {
|
||||
opacity: 0.7;
|
||||
}
|
||||
[data-overlay="8"]::before {
|
||||
opacity: 0.8;
|
||||
}
|
||||
[data-overlay="9"]::before {
|
||||
opacity: 0.9;
|
||||
}
|
||||
@ -0,0 +1,351 @@
|
||||
/* Magnific Popup CSS */
|
||||
.mfp-bg {
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1042;
|
||||
overflow: hidden;
|
||||
position: fixed;
|
||||
background: #0b0b0b;
|
||||
opacity: 0.8; }
|
||||
|
||||
.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;
|
||||
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: #CCC;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
width: auto;
|
||||
text-align: center;
|
||||
margin-top: -0.8em;
|
||||
left: 8px;
|
||||
right: 8px;
|
||||
z-index: 1044; }
|
||||
.mfp-preloader a {
|
||||
color: #CCC; }
|
||||
.mfp-preloader a:hover {
|
||||
color: #FFF; }
|
||||
|
||||
.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;
|
||||
box-shadow: none;
|
||||
touch-action: manipulation; }
|
||||
|
||||
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;
|
||||
padding: 0 0 18px 10px;
|
||||
color: #FFF;
|
||||
font-style: normal;
|
||||
font-size: 28px;
|
||||
font-family: Arial, Baskerville, monospace; }
|
||||
.mfp-close:hover,
|
||||
.mfp-close:focus {
|
||||
opacity: 1; }
|
||||
.mfp-close:active {
|
||||
top: 1px; }
|
||||
|
||||
.mfp-close-btn-in .mfp-close {
|
||||
color: #333; }
|
||||
|
||||
.mfp-image-holder .mfp-close,
|
||||
.mfp-iframe-holder .mfp-close {
|
||||
color: #FFF;
|
||||
right: -6px;
|
||||
text-align: right;
|
||||
padding-right: 6px;
|
||||
width: 100%; }
|
||||
|
||||
.mfp-counter {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
color: #CCC;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
white-space: nowrap; }
|
||||
|
||||
.mfp-arrow {
|
||||
position: absolute;
|
||||
opacity: 0.65;
|
||||
margin: 0;
|
||||
top: 50%;
|
||||
margin-top: -55px;
|
||||
padding: 0;
|
||||
width: 90px;
|
||||
height: 110px;
|
||||
-webkit-tap-highlight-color: transparent; }
|
||||
.mfp-arrow:active {
|
||||
margin-top: -54px; }
|
||||
.mfp-arrow:hover,
|
||||
.mfp-arrow:focus {
|
||||
opacity: 1; }
|
||||
.mfp-arrow:before,
|
||||
.mfp-arrow:after {
|
||||
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 {
|
||||
border-top-width: 13px;
|
||||
border-bottom-width: 13px;
|
||||
top: 8px; }
|
||||
.mfp-arrow:before {
|
||||
border-top-width: 21px;
|
||||
border-bottom-width: 21px;
|
||||
opacity: 0.7; }
|
||||
|
||||
.mfp-arrow-left {
|
||||
left: 0; }
|
||||
.mfp-arrow-left:after {
|
||||
border-right: 17px solid #FFF;
|
||||
margin-left: 31px; }
|
||||
.mfp-arrow-left:before {
|
||||
margin-left: 25px;
|
||||
border-right: 27px solid #3F3F3F; }
|
||||
|
||||
.mfp-arrow-right {
|
||||
right: 0; }
|
||||
.mfp-arrow-right:after {
|
||||
border-left: 17px solid #FFF;
|
||||
margin-left: 39px; }
|
||||
.mfp-arrow-right:before {
|
||||
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: #000; }
|
||||
|
||||
/* Main image in popup */
|
||||
img.mfp-img {
|
||||
width: auto;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
display: block;
|
||||
line-height: 0;
|
||||
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: #444; }
|
||||
.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;
|
||||
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; } }
|
||||
@ -0,0 +1,119 @@
|
||||
/* Slider */
|
||||
.slick-slider
|
||||
{
|
||||
position: relative;
|
||||
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
-webkit-touch-callout: none;
|
||||
-khtml-user-select: none;
|
||||
-ms-touch-action: pan-y;
|
||||
touch-action: pan-y;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
.slick-list
|
||||
{
|
||||
position: relative;
|
||||
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.slick-list:focus
|
||||
{
|
||||
outline: none;
|
||||
}
|
||||
.slick-list.dragging
|
||||
{
|
||||
cursor: pointer;
|
||||
cursor: hand;
|
||||
}
|
||||
|
||||
.slick-slider .slick-track,
|
||||
.slick-slider .slick-list
|
||||
{
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
-moz-transform: translate3d(0, 0, 0);
|
||||
-ms-transform: translate3d(0, 0, 0);
|
||||
-o-transform: translate3d(0, 0, 0);
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
.slick-track
|
||||
{
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.slick-track:before,
|
||||
.slick-track:after
|
||||
{
|
||||
display: table;
|
||||
|
||||
content: '';
|
||||
}
|
||||
.slick-track:after
|
||||
{
|
||||
clear: both;
|
||||
}
|
||||
.slick-loading .slick-track
|
||||
{
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.slick-slide
|
||||
{
|
||||
display: none;
|
||||
float: left;
|
||||
|
||||
height: 100%;
|
||||
min-height: 1px;
|
||||
}
|
||||
[dir='rtl'] .slick-slide
|
||||
{
|
||||
float: right;
|
||||
}
|
||||
.slick-slide img
|
||||
{
|
||||
display: block;
|
||||
}
|
||||
.slick-slide.slick-loading img
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
.slick-slide.dragging img
|
||||
{
|
||||
pointer-events: none;
|
||||
}
|
||||
.slick-initialized .slick-slide
|
||||
{
|
||||
display: block;
|
||||
}
|
||||
.slick-loading .slick-slide
|
||||
{
|
||||
visibility: hidden;
|
||||
}
|
||||
.slick-vertical .slick-slide
|
||||
{
|
||||
display: block;
|
||||
|
||||
height: auto;
|
||||
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
.slick-arrow.slick-hidden {
|
||||
display: none;
|
||||
}
|
||||
|
After Width: | Height: | Size: 560 KiB |
|
After Width: | Height: | Size: 64 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 625 B |
|
After Width: | Height: | Size: 625 B |
|
After Width: | Height: | Size: 625 B |
|
After Width: | Height: | Size: 317 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 370 KiB |
|
After Width: | Height: | Size: 202 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
@ -0,0 +1 @@
|
||||
!function(e){e.fn.appear=function(a,r){var p=e.extend({data:void 0,one:!0,accX:0,accY:0},r);return this.each(function(){var r=e(this);if(r.appeared=!1,a){var n=e(window),t=function(){if(r.is(":visible")){var e=n.scrollLeft(),a=n.scrollTop(),t=r.offset(),c=t.left,i=t.top,o=p.accX,f=p.accY,s=r.height(),l=n.height(),h=r.width(),d=n.width();i+s+f>=a&&i<=a+l+f&&c+h+o>=e&&c<=e+d+o?r.appeared||r.trigger("appear",p.data):r.appeared=!1}else r.appeared=!1},c=function(){if(r.appeared=!0,p.one){n.unbind("scroll",t);var c=e.inArray(t,e.fn.appear.checks);c>=0&&e.fn.appear.checks.splice(c,1)}a.apply(this,arguments)};p.one?r.one("appear",p.data,c):r.bind("appear",p.data,c),n.scroll(t),e.fn.appear.checks.push(t),t()}else r.trigger("appear",p.data)})},e.extend(e.fn.appear,{checks:[],timeout:null,checkAll:function(){var a=e.fn.appear.checks.length;if(a>0)for(;a--;)e.fn.appear.checks[a]()},run:function(){e.fn.appear.timeout&&clearTimeout(e.fn.appear.timeout),e.fn.appear.timeout=setTimeout(e.fn.appear.checkAll,20)}}),e.each(["append","prepend","after","before","attr","removeAttr","addClass","removeClass","toggleClass","remove","css","show","hide"],function(a,r){var p=e.fn[r];p&&(e.fn[r]=function(){var a=p.apply(this,arguments);return e.fn.appear.run(),a})})}(jQuery);
|
||||
@ -0,0 +1,8 @@
|
||||
/*!
|
||||
* jquery.counterup.js 1.0
|
||||
*
|
||||
* Copyright 2013, Benjamin Intal http://gambit.ph @bfintal
|
||||
* Released under the GPL v2 License
|
||||
*
|
||||
* Date: Nov 26, 2013
|
||||
*/(function(e){"use strict";e.fn.counterUp=function(t){var n=e.extend({time:400,delay:10},t);return this.each(function(){var t=e(this),r=n,i=function(){var e=[],n=r.time/r.delay,i=t.text(),s=/[0-9]+,[0-9]+/.test(i);i=i.replace(/,/g,"");var o=/^[0-9]+$/.test(i),u=/^[0-9]+\.[0-9]+$/.test(i),a=u?(i.split(".")[1]||[]).length:0;for(var f=n;f>=1;f--){var l=parseInt(i/n*f);u&&(l=parseFloat(i/n*f).toFixed(a));if(s)while(/(\d+)(\d{3})/.test(l.toString()))l=l.toString().replace(/(\d+)(\d{3})/,"$1,$2");e.unshift(l)}t.data("counterup-nums",e);t.text("0");var c=function(){t.text(t.data("counterup-nums").shift());if(t.data("counterup-nums").length)setTimeout(t.data("counterup-func"),r.delay);else{delete t.data("counterup-nums");t.data("counterup-nums",null);t.data("counterup-func",null)}};t.data("counterup-func",c);setTimeout(t.data("counterup-func"),r.delay)};t.waypoint(i,{offset:"100%",triggerOnce:!0})})}})(jQuery);
|
||||
@ -0,0 +1,138 @@
|
||||
(function($){
|
||||
|
||||
"use strict";
|
||||
|
||||
//===== Prealoder
|
||||
|
||||
$(window).on('load', function(event) {
|
||||
$('.preloader').delay(500).fadeOut(500);
|
||||
});
|
||||
|
||||
|
||||
//===== Mobile Menu
|
||||
|
||||
$(".navbar-toggler").on('click', function() {
|
||||
$(this).toggleClass('active');
|
||||
});
|
||||
|
||||
$(".navbar-nav a").on('click', function() {
|
||||
$(".navbar-toggler").removeClass('active');
|
||||
});
|
||||
|
||||
|
||||
//===== close navbar-collapse when a clicked
|
||||
|
||||
$(".navbar-nav a").on('click', function () {
|
||||
$(".navbar-collapse").removeClass("show");
|
||||
});
|
||||
|
||||
|
||||
//===== Sticky
|
||||
|
||||
$(window).on('scroll', function(event) {
|
||||
var scroll = $(window).scrollTop();
|
||||
if (scroll < 10) {
|
||||
$(".navigation").removeClass("sticky");
|
||||
} else{
|
||||
$(".navigation").addClass("sticky");
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
//===== Section Menu Active
|
||||
|
||||
var scrollLink = $('.page-scroll');
|
||||
// Active link switching
|
||||
$(window).scroll(function() {
|
||||
var scrollbarLocation = $(this).scrollTop();
|
||||
|
||||
scrollLink.each(function() {
|
||||
|
||||
var sectionOffset = $(this.hash).offset().top - 73;
|
||||
|
||||
if ( sectionOffset <= scrollbarLocation ) {
|
||||
$(this).parent().addClass('active');
|
||||
$(this).parent().siblings().removeClass('active');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
// Parallaxmouse js
|
||||
|
||||
function parallaxMouse() {
|
||||
if ($('#parallax').length) {
|
||||
var scene = document.getElementById('parallax');
|
||||
var parallax = new Parallax(scene);
|
||||
};
|
||||
};
|
||||
parallaxMouse();
|
||||
|
||||
|
||||
//===== Progress Bar
|
||||
|
||||
if($('.progress-line').length){
|
||||
$('.progress-line').appear(function(){
|
||||
var el = $(this);
|
||||
var percent = el.data('width');
|
||||
$(el).css('width',percent+'%');
|
||||
},{accY: 0});
|
||||
}
|
||||
|
||||
|
||||
//===== Counter Up
|
||||
|
||||
$('.counter').counterUp({
|
||||
delay: 10,
|
||||
time: 1600,
|
||||
});
|
||||
|
||||
|
||||
//===== Magnific Popup
|
||||
|
||||
$('.image-popup').magnificPopup({
|
||||
type: 'image',
|
||||
gallery:{
|
||||
enabled:true
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
//===== Back to top
|
||||
|
||||
// Show or hide the sticky footer button
|
||||
$(window).on('scroll', function(event) {
|
||||
if($(this).scrollTop() > 600){
|
||||
$('.back-to-top').fadeIn(200)
|
||||
} else{
|
||||
$('.back-to-top').fadeOut(200)
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
//Animate the scroll to yop
|
||||
$('.back-to-top').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
|
||||
$('html, body').animate({
|
||||
scrollTop: 0,
|
||||
}, 1500);
|
||||
});
|
||||
|
||||
|
||||
|
||||
//=====
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}(jQuery));
|
||||
@ -0,0 +1,169 @@
|
||||
! function (t, i, e) {
|
||||
"use strict";
|
||||
|
||||
function s(t, i) {
|
||||
this.element = t, this.layers = t.getElementsByClassName("layer");
|
||||
var e = {
|
||||
calibrateX: this.data(this.element, "calibrate-x"),
|
||||
calibrateY: this.data(this.element, "calibrate-y"),
|
||||
invertX: this.data(this.element, "invert-x"),
|
||||
invertY: this.data(this.element, "invert-y"),
|
||||
limitX: this.data(this.element, "limit-x"),
|
||||
limitY: this.data(this.element, "limit-y"),
|
||||
scalarX: this.data(this.element, "scalar-x"),
|
||||
scalarY: this.data(this.element, "scalar-y"),
|
||||
frictionX: this.data(this.element, "friction-x"),
|
||||
frictionY: this.data(this.element, "friction-y"),
|
||||
originX: this.data(this.element, "origin-x"),
|
||||
originY: this.data(this.element, "origin-y")
|
||||
};
|
||||
for (var s in e) null === e[s] && delete e[s];
|
||||
this.extend(this, r, i, e), this.calibrationTimer = null, this.calibrationFlag = !0, this.enabled = !1, this.depths = [], this.raf = null, this.bounds = null, this.ex = 0, this.ey = 0, this.ew = 0, this.eh = 0, this.ecx = 0, this.ecy = 0, this.erx = 0, this.ery = 0, this.cx = 0, this.cy = 0, this.ix = 0, this.iy = 0, this.mx = 0, this.my = 0, this.vx = 0, this.vy = 0, this.onMouseMove = this.onMouseMove.bind(this), this.onDeviceOrientation = this.onDeviceOrientation.bind(this), this.onOrientationTimer = this.onOrientationTimer.bind(this), this.onCalibrationTimer = this.onCalibrationTimer.bind(this), this.onAnimationFrame = this.onAnimationFrame.bind(this), this.onWindowResize = this.onWindowResize.bind(this), this.initialise()
|
||||
}
|
||||
var n = "Parallax",
|
||||
o = 30,
|
||||
r = {
|
||||
relativeInput: !1,
|
||||
clipRelativeInput: !1,
|
||||
calibrationThreshold: 100,
|
||||
calibrationDelay: 500,
|
||||
supportDelay: 500,
|
||||
calibrateX: !1,
|
||||
calibrateY: !0,
|
||||
invertX: !0,
|
||||
invertY: !0,
|
||||
limitX: !1,
|
||||
limitY: !1,
|
||||
scalarX: 10,
|
||||
scalarY: 10,
|
||||
frictionX: .1,
|
||||
frictionY: .1,
|
||||
originX: .5,
|
||||
originY: .5
|
||||
};
|
||||
s.prototype.extend = function () {
|
||||
if (arguments.length > 1)
|
||||
for (var t = arguments[0], i = 1, e = arguments.length; e > i; i++) {
|
||||
var s = arguments[i];
|
||||
for (var n in s) t[n] = s[n]
|
||||
}
|
||||
}, s.prototype.data = function (t, i) {
|
||||
return this.deserialize(t.getAttribute("data-" + i))
|
||||
}, s.prototype.deserialize = function (t) {
|
||||
return "true" === t ? !0 : "false" === t ? !1 : "null" === t ? null : !isNaN(parseFloat(t)) && isFinite(t) ? parseFloat(t) : t
|
||||
}, s.prototype.camelCase = function (t) {
|
||||
return t.replace(/-+(.)?/g, function (t, i) {
|
||||
return i ? i.toUpperCase() : ""
|
||||
})
|
||||
}, s.prototype.transformSupport = function (s) {
|
||||
for (var n = i.createElement("div"), o = !1, r = null, a = !1, h = null, l = null, p = 0, c = this.vendors.length; c > p; p++)
|
||||
if (null !== this.vendors[p] ? (h = this.vendors[p][0] + "transform", l = this.vendors[p][1] + "Transform") : (h = "transform", l = "transform"), n.style[l] !== e) {
|
||||
o = !0;
|
||||
break
|
||||
}
|
||||
switch (s) {
|
||||
case "2D":
|
||||
a = o;
|
||||
break;
|
||||
case "3D":
|
||||
if (o) {
|
||||
var m = i.body || i.createElement("body"),
|
||||
u = i.documentElement,
|
||||
y = u.style.overflow;
|
||||
i.body || (u.style.overflow = "hidden", u.appendChild(m), m.style.overflow = "hidden", m.style.background = ""), m.appendChild(n), n.style[l] = "translate3d(1px,1px,1px)", r = t.getComputedStyle(n).getPropertyValue(h), a = r !== e && r.length > 0 && "none" !== r, u.style.overflow = y, m.removeChild(n)
|
||||
}
|
||||
}
|
||||
return a
|
||||
}, s.prototype.ww = null, s.prototype.wh = null, s.prototype.wcx = null, s.prototype.wcy = null, s.prototype.wrx = null, s.prototype.wry = null, s.prototype.portrait = null, s.prototype.desktop = !navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry|BB10|mobi|tablet|opera mini|nexus 7)/i), s.prototype.vendors = [null, ["-webkit-", "webkit"], ["-moz-", "Moz"], ["-o-", "O"], ["-ms-", "ms"]], s.prototype.motionSupport = !!t.DeviceMotionEvent, s.prototype.orientationSupport = !!t.DeviceOrientationEvent, s.prototype.orientationStatus = 0, s.prototype.transform2DSupport = s.prototype.transformSupport("2D"), s.prototype.transform3DSupport = s.prototype.transformSupport("3D"), s.prototype.propertyCache = {}, s.prototype.initialise = function () {
|
||||
this.transform3DSupport && this.accelerate(this.element);
|
||||
var i = t.getComputedStyle(this.element);
|
||||
"static" === i.getPropertyValue("position") && (this.element.style.position = "relative"), this.updateLayers(), this.updateDimensions(), this.enable(), this.queueCalibration(this.calibrationDelay)
|
||||
}, s.prototype.updateLayers = function () {
|
||||
this.layers = this.element.getElementsByClassName("layer"), this.depths = [];
|
||||
for (var t = 0, i = this.layers.length; i > t; t++) {
|
||||
var e = this.layers[t];
|
||||
this.transform3DSupport && this.accelerate(e), e.style.position = t ? "absolute" : "relative", e.style.display = "block", e.style.left = 0, e.style.top = 0, this.depths.push(this.data(e, "depth") || 0)
|
||||
}
|
||||
}, s.prototype.updateDimensions = function () {
|
||||
this.ww = t.innerWidth, this.wh = t.innerHeight, this.wcx = this.ww * this.originX, this.wcy = this.wh * this.originY, this.wrx = Math.max(this.wcx, this.ww - this.wcx), this.wry = Math.max(this.wcy, this.wh - this.wcy)
|
||||
}, s.prototype.updateBounds = function () {
|
||||
this.bounds = this.element.getBoundingClientRect(), this.ex = this.bounds.left, this.ey = this.bounds.top, this.ew = this.bounds.width, this.eh = this.bounds.height, this.ecx = this.ew * this.originX, this.ecy = this.eh * this.originY, this.erx = Math.max(this.ecx, this.ew - this.ecx), this.ery = Math.max(this.ecy, this.eh - this.ecy)
|
||||
}, s.prototype.queueCalibration = function (t) {
|
||||
clearTimeout(this.calibrationTimer), this.calibrationTimer = setTimeout(this.onCalibrationTimer, t)
|
||||
}, s.prototype.enable = function () {
|
||||
this.enabled || (this.enabled = !0, this.orientationSupport ? (this.portrait = null, t.addEventListener("deviceorientation", this.onDeviceOrientation), setTimeout(this.onOrientationTimer, this.supportDelay)) : (this.cx = 0, this.cy = 0, this.portrait = !1, t.addEventListener("mousemove", this.onMouseMove)), t.addEventListener("resize", this.onWindowResize), this.raf = requestAnimationFrame(this.onAnimationFrame))
|
||||
}, s.prototype.disable = function () {
|
||||
this.enabled && (this.enabled = !1, this.orientationSupport ? t.removeEventListener("deviceorientation", this.onDeviceOrientation) : t.removeEventListener("mousemove", this.onMouseMove), t.removeEventListener("resize", this.onWindowResize), cancelAnimationFrame(this.raf))
|
||||
}, s.prototype.calibrate = function (t, i) {
|
||||
this.calibrateX = t === e ? this.calibrateX : t, this.calibrateY = i === e ? this.calibrateY : i
|
||||
}, s.prototype.invert = function (t, i) {
|
||||
this.invertX = t === e ? this.invertX : t, this.invertY = i === e ? this.invertY : i
|
||||
}, s.prototype.friction = function (t, i) {
|
||||
this.frictionX = t === e ? this.frictionX : t, this.frictionY = i === e ? this.frictionY : i
|
||||
}, s.prototype.scalar = function (t, i) {
|
||||
this.scalarX = t === e ? this.scalarX : t, this.scalarY = i === e ? this.scalarY : i
|
||||
}, s.prototype.limit = function (t, i) {
|
||||
this.limitX = t === e ? this.limitX : t, this.limitY = i === e ? this.limitY : i
|
||||
}, s.prototype.origin = function (t, i) {
|
||||
this.originX = t === e ? this.originX : t, this.originY = i === e ? this.originY : i
|
||||
}, s.prototype.clamp = function (t, i, e) {
|
||||
return t = Math.max(t, i), t = Math.min(t, e)
|
||||
}, s.prototype.css = function (t, i, s) {
|
||||
var n = this.propertyCache[i];
|
||||
if (!n)
|
||||
for (var o = 0, r = this.vendors.length; r > o; o++)
|
||||
if (n = null !== this.vendors[o] ? this.camelCase(this.vendors[o][1] + "-" + i) : i, t.style[n] !== e) {
|
||||
this.propertyCache[i] = n;
|
||||
break
|
||||
}
|
||||
t.style[n] = s
|
||||
}, s.prototype.accelerate = function (t) {
|
||||
this.css(t, "transform", "translate3d(0,0,0)"), this.css(t, "transform-style", "preserve-3d"), this.css(t, "backface-visibility", "hidden")
|
||||
}, s.prototype.setPosition = function (t, i, e) {
|
||||
i += "px", e += "px", this.transform3DSupport ? this.css(t, "transform", "translate3d(" + i + "," + e + ",0)") : this.transform2DSupport ? this.css(t, "transform", "translate(" + i + "," + e + ")") : (t.style.left = i, t.style.top = e)
|
||||
}, s.prototype.onOrientationTimer = function () {
|
||||
this.orientationSupport && 0 === this.orientationStatus && (this.disable(), this.orientationSupport = !1, this.enable())
|
||||
}, s.prototype.onCalibrationTimer = function () {
|
||||
this.calibrationFlag = !0
|
||||
}, s.prototype.onWindowResize = function () {
|
||||
this.updateDimensions()
|
||||
}, s.prototype.onAnimationFrame = function () {
|
||||
this.updateBounds();
|
||||
var t = this.ix - this.cx,
|
||||
i = this.iy - this.cy;
|
||||
(Math.abs(t) > this.calibrationThreshold || Math.abs(i) > this.calibrationThreshold) && this.queueCalibration(0), this.portrait ? (this.mx = this.calibrateX ? i : this.iy, this.my = this.calibrateY ? t : this.ix) : (this.mx = this.calibrateX ? t : this.ix, this.my = this.calibrateY ? i : this.iy), this.mx *= this.ew * (this.scalarX / 100), this.my *= this.eh * (this.scalarY / 100), isNaN(parseFloat(this.limitX)) || (this.mx = this.clamp(this.mx, -this.limitX, this.limitX)), isNaN(parseFloat(this.limitY)) || (this.my = this.clamp(this.my, -this.limitY, this.limitY)), this.vx += (this.mx - this.vx) * this.frictionX, this.vy += (this.my - this.vy) * this.frictionY;
|
||||
for (var e = 0, s = this.layers.length; s > e; e++) {
|
||||
var n = this.layers[e],
|
||||
o = this.depths[e],
|
||||
r = this.vx * o * (this.invertX ? -1 : 1),
|
||||
a = this.vy * o * (this.invertY ? -1 : 1);
|
||||
this.setPosition(n, r, a)
|
||||
}
|
||||
this.raf = requestAnimationFrame(this.onAnimationFrame)
|
||||
}, s.prototype.onDeviceOrientation = function (t) {
|
||||
if (!this.desktop && null !== t.beta && null !== t.gamma) {
|
||||
this.orientationStatus = 1;
|
||||
var i = (t.beta || 0) / o,
|
||||
e = (t.gamma || 0) / o,
|
||||
s = this.wh > this.ww;
|
||||
this.portrait !== s && (this.portrait = s, this.calibrationFlag = !0), this.calibrationFlag && (this.calibrationFlag = !1, this.cx = i, this.cy = e), this.ix = i, this.iy = e
|
||||
}
|
||||
}, s.prototype.onMouseMove = function (t) {
|
||||
var i = t.clientX,
|
||||
e = t.clientY;
|
||||
!this.orientationSupport && this.relativeInput ? (this.clipRelativeInput && (i = Math.max(i, this.ex), i = Math.min(i, this.ex + this.ew), e = Math.max(e, this.ey), e = Math.min(e, this.ey + this.eh)), this.ix = (i - this.ex - this.ecx) / this.erx, this.iy = (e - this.ey - this.ecy) / this.ery) : (this.ix = (i - this.wcx) / this.wrx, this.iy = (e - this.wcy) / this.wry)
|
||||
}, t[n] = s
|
||||
}(window, document),
|
||||
function () {
|
||||
for (var t = 0, i = ["ms", "moz", "webkit", "o"], e = 0; e < i.length && !window.requestAnimationFrame; ++e) window.requestAnimationFrame = window[i[e] + "RequestAnimationFrame"], window.cancelAnimationFrame = window[i[e] + "CancelAnimationFrame"] || window[i[e] + "CancelRequestAnimationFrame"];
|
||||
window.requestAnimationFrame || (window.requestAnimationFrame = function (i) {
|
||||
var e = (new Date).getTime(),
|
||||
s = Math.max(0, 16 - (e - t)),
|
||||
n = window.setTimeout(function () {
|
||||
i(e + s)
|
||||
}, s);
|
||||
return t = e + s, n
|
||||
}), window.cancelAnimationFrame || (window.cancelAnimationFrame = function (t) {
|
||||
clearTimeout(t)
|
||||
})
|
||||
}();
|
||||
@ -0,0 +1,19 @@
|
||||
|
||||
//jQuery for page scrolling feature - requires jQuery Easing plugin
|
||||
$(function() {
|
||||
|
||||
$('a.page-scroll[href*="#"]:not([href="#"])').on('click', function () {
|
||||
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
|
||||
var target = $(this.hash);
|
||||
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
|
||||
if (target.length) {
|
||||
$('html, body').animate({
|
||||
scrollTop: (target.offset().top -70)
|
||||
}, 1200, "easeInOutExpo");
|
||||
return false;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
@ -0,0 +1,437 @@
|
||||
<!doctype html>
|
||||
<html lang="de-">
|
||||
|
||||
<head>
|
||||
|
||||
<!--====== Required meta tags ======-->
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
|
||||
<!--====== Title ======-->
|
||||
<title>Samuel Zielke</title>
|
||||
|
||||
<!--====== Favicon Icon ======-->
|
||||
<link rel="shortcut icon" href="assets/images/favicon.png" type="image/png">
|
||||
|
||||
<!--====== Bootstrap css ======-->
|
||||
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
|
||||
|
||||
<!--====== Line Icons css ======-->
|
||||
<link rel="stylesheet" href="assets/css/LineIcons.css">
|
||||
|
||||
<!--====== Magnific Popup css ======-->
|
||||
<link rel="stylesheet" href="assets/css/magnific-popup.css">
|
||||
|
||||
<!--====== Default css ======-->
|
||||
<link rel="stylesheet" href="assets/css/default.css">
|
||||
|
||||
<!--====== Style css ======-->
|
||||
<link rel="stylesheet" href="assets/css/style.css">
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<!--====== PRELOADER PART START ======-->
|
||||
|
||||
<div class="preloader">
|
||||
<div class="loader_34">
|
||||
<div class="ytp-spinner">
|
||||
<div class="ytp-spinner-container">
|
||||
<div class="ytp-spinner-rotator">
|
||||
<div class="ytp-spinner-left">
|
||||
<div class="ytp-spinner-circle"></div>
|
||||
</div>
|
||||
<div class="ytp-spinner-right">
|
||||
<div class="ytp-spinner-circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--====== PRELOADER ENDS START ======-->
|
||||
|
||||
<!--====== HEADER PART START ======-->
|
||||
|
||||
<header id="home" class="header-area">
|
||||
<div class="navigation fixed-top">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
<a class="navbar-brand" href="index.html">
|
||||
<img src="assets/images/logo.png" alt="Logo">
|
||||
</a> <!-- Logo -->
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="toggler-icon"></span>
|
||||
<span class="toggler-icon"></span>
|
||||
<span class="toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<li class="nav-item active"><a class="page-scroll" href="#home">Start</a></li>
|
||||
<li class="nav-item"><a class="page-scroll" href="#about">Über mich</a></li>
|
||||
<!-- <li class="nav-item"><a class="page-scroll" href="#service">Service</a></li> -->
|
||||
<!-- <li class="nav-item"><a class="page-scroll" href="#work">Portfolio</a></li> -->
|
||||
<!-- <li class="nav-item"><a class="page-scroll" href="#blog">Blog</a></li> -->
|
||||
<li class="nav-item"><a class="page-scroll" href="#contact">Kontakt</a></li>
|
||||
</ul>
|
||||
</div> <!-- navbar collapse -->
|
||||
</nav> <!-- navbar -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</div> <!-- navigation -->
|
||||
|
||||
<div id="parallax" class="header-content d-flex align-items-center">
|
||||
<div class="header-shape shape-one layer" data-depth="0.10">
|
||||
<img src="assets/images/banner/shape/shape-1.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="header-shape shape-tow layer" data-depth="0.30">
|
||||
<img src="assets/images/banner/shape/shape-2.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="header-shape shape-three layer" data-depth="0.40">
|
||||
<img src="assets/images/banner/shape/shape-3.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="header-shape shape-fore layer" data-depth="0.60">
|
||||
<img src="assets/images/banner/shape/shape-2.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="header-shape shape-five layer" data-depth="0.20">
|
||||
<img src="assets/images/banner/shape/shape-1.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="header-shape shape-six layer" data-depth="0.15">
|
||||
<img src="assets/images/banner/shape/shape-4.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="header-shape shape-seven layer" data-depth="0.50">
|
||||
<img src="assets/images/banner/shape/shape-5.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="header-shape shape-eight layer" data-depth="0.40">
|
||||
<img src="assets/images/banner/shape/shape-3.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="header-shape shape-nine layer" data-depth="0.20">
|
||||
<img src="assets/images/banner/shape/shape-6.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="header-shape shape-ten layer" data-depth="0.30">
|
||||
<img src="assets/images/banner/shape/shape-3.png" alt="Shape">
|
||||
</div> <!-- header shape -->
|
||||
<div class="container">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-xl-5 col-lg-6">
|
||||
<div class="header-content-right">
|
||||
<h4 class="sub-title">Hi, Ich bin</h4>
|
||||
<h1 class="title">Samuel!</h1>
|
||||
<p>Ich bin Elektriker und Hobby-Anwengungsentwickler</p>
|
||||
<!-- <a class="main-btn" href="#work">View my Work</a> -->
|
||||
</div> <!-- header content right -->
|
||||
</div>
|
||||
<div class="col-lg-6 offset-xl-1">
|
||||
<div class="header-image d-none d-lg-block">
|
||||
<img src="assets/images/myself_freeB.png" alt="hero">
|
||||
</div> <!-- header image -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
<div class="header-social">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="header-social-icon">
|
||||
<ul>
|
||||
<!-- <li><a href="#"><i class="lni-facebook-filled"></i></a></li> -->
|
||||
<!-- <li><a href="#"><i class="lni-twitter-original"></i></a></li>
|
||||
<li><a href="#"><i class="lni-behance-original"></i></a></li>
|
||||
<li><a href="#"><i class="lni-linkedin-original"></i></a></li> -->
|
||||
</ul>
|
||||
</div> <!-- header social -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</div> <!-- header social -->
|
||||
</div> <!-- header content -->
|
||||
</header>
|
||||
|
||||
<!--====== HEADER PART ENDS ======-->
|
||||
|
||||
<!--====== ABOUT PART START ======-->
|
||||
|
||||
<section id="about" class="about-area pt-125 pb-130">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-8">
|
||||
<div class="section-title text-center">
|
||||
<h2 class="title">Über mich</h2>
|
||||
<p>Bin Anfang 2000 geboren und lebe seit dem in und in der Umgebung von Alsfeld. Manche nennen mich einen Nerd, andere einen Spinner. Ich lache gerne mit Freunden und Familie. Ein Typ mit zu vielen Hobbys, der es aber langsam einsieht und aussortiert. Projekte in denen ich meine Hobbys verbinde sind die besten, z.B. SmartHome oder eine selbstgebaute Drohne.</p>
|
||||
</div> <!-- section title -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<div class="about-content mt-50">
|
||||
<h5 class="about-title">Hi! Ich bin Samuel Zielke</h5>
|
||||
<p>💼 Arbeite als Elektrokonstrukteur bei <a href="https://mk-versuchsanlagen.de">MK Versuchsanlagen</a>
|
||||
<br>
|
||||
<br>🔨 Handwerker und Bastler seit der Geburt
|
||||
<br>
|
||||
<br>💡 Ordentlich aber definitiv kein Künstler/Designer 😉
|
||||
<br>
|
||||
<br>👨🏼💻 Wenn andere lesen, programmmiere ich
|
||||
<br>
|
||||
<br>🚒 24/7 Bereit für euch, als Feuerwehrmann
|
||||
<br>
|
||||
<br>📖 Als Zeuge Jehovas begeistert von der Bibel -> <a href="http://www.jw.org">JW.ORG</a></p>
|
||||
<ul class="clearfix">
|
||||
<li>
|
||||
<div class="single-info d-flex align-items-center">
|
||||
<div class="info-icon">
|
||||
<i class="lni-heart"></i>
|
||||
</div>
|
||||
<div class="info-text">
|
||||
<p><span>Hochzeitsjahr:</span> 2021</p>
|
||||
</div>
|
||||
</div> <!-- single info -->
|
||||
</li>
|
||||
<li>
|
||||
<div class="single-info d-flex align-items-center">
|
||||
<div class="info-icon">
|
||||
<i class="lni-envelope"></i>
|
||||
</div>
|
||||
<div class="info-text">
|
||||
<p><span>Email:</span> mail@samuelzielke.de</p>
|
||||
</div>
|
||||
</div> <!-- single info -->
|
||||
</li>
|
||||
<li>
|
||||
<div class="single-info d-flex align-items-center">
|
||||
<div class="info-icon">
|
||||
<i class="lni-phone-handset"></i>
|
||||
</div>
|
||||
<div class="info-text">
|
||||
<p><span>Telefon:</span> +49 (0) 6631 7095067</p>
|
||||
</div>
|
||||
</div> <!-- single info -->
|
||||
</li>
|
||||
<li>
|
||||
<div class="single-info d-flex align-items-center">
|
||||
<div class="info-icon">
|
||||
<i class="lni-map-marker"></i>
|
||||
</div>
|
||||
<div class="info-text">
|
||||
<p><span>Standort:</span> DE-36304 Alsfeld</p>
|
||||
</div>
|
||||
</div> <!-- single info -->
|
||||
</li>
|
||||
</ul>
|
||||
</div> <!-- about content -->
|
||||
</div>
|
||||
<div class="col-xl-5 offset-xl-1 col-lg-6">
|
||||
<div class="about-skills pt-25">
|
||||
<div class="skill-item mt-25">
|
||||
<div class="skill-header">
|
||||
<h6 class="skill-title">Elektroinstallation (Wohnen und Industrie)</h6>
|
||||
<div class="skill-percentage">
|
||||
<div class="count-box counted">
|
||||
<span class="counter">90</span>
|
||||
</div>
|
||||
%
|
||||
</div>
|
||||
</div>
|
||||
<div class="skill-bar">
|
||||
<div class="bar-inner">
|
||||
<div class="bar progress-line" data-width="90"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- skill item -->
|
||||
<div class="skill-item mt-25">
|
||||
<div class="skill-header">
|
||||
<h6 class="skill-title">Elektroplanung und Prüfung (CAD, VDE-Unterlagen)</h6>
|
||||
<div class="skill-percentage">
|
||||
<div class="count-box counted">
|
||||
<span class="counter">75</span>
|
||||
</div>
|
||||
%
|
||||
</div>
|
||||
</div>
|
||||
<div class="skill-bar">
|
||||
<div class="bar-inner">
|
||||
<div class="bar progress-line" data-width="80"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- skill item -->
|
||||
<div class="skill-item mt-25">
|
||||
<div class="skill-header">
|
||||
<h6 class="skill-title">IT/EDV Erfahrung (Software u. Hardware)</h6>
|
||||
<div class="skill-percentage">
|
||||
<div class="count-box counted">
|
||||
<span class="counter">45</span>
|
||||
</div>
|
||||
%
|
||||
</div>
|
||||
</div>
|
||||
<div class="skill-bar">
|
||||
<div class="bar-inner">
|
||||
<div class="bar progress-line" data-width="45"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- skill item -->
|
||||
<div class="skill-item mt-25">
|
||||
<div class="skill-header">
|
||||
<h6 class="skill-title">Webentwickler (SQL, Python, HTML, CSS, PHP)</h6>
|
||||
<div class="skill-percentage">
|
||||
<div class="count-box counted">
|
||||
<span class="counter">55</span>
|
||||
</div>
|
||||
%
|
||||
</div>
|
||||
</div>
|
||||
<div class="skill-bar">
|
||||
<div class="bar-inner">
|
||||
<div class="bar progress-line" data-width="55"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- skill item -->
|
||||
<div class="skill-item mt-25">
|
||||
<div class="skill-header">
|
||||
<h6 class="skill-title">Foto- und Videograf (Extra Nebengewerbe)</h6>
|
||||
<div class="skill-percentage">
|
||||
<div class="count-box counted">
|
||||
<span class="counter">70</span>
|
||||
</div>
|
||||
%
|
||||
</div>
|
||||
</div>
|
||||
<div class="skill-bar">
|
||||
<div class="bar-inner">
|
||||
<div class="bar progress-line" data-width="70"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- skill item -->
|
||||
</div> <!-- about skills -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</section>
|
||||
|
||||
<!--====== ABOUT PART ENDS ======-->
|
||||
|
||||
<!--====== CONTACT PART START ======-->
|
||||
|
||||
<section id="contact" class="contact-area pt-125 pb-130 gray-bg">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-8">
|
||||
<div class="section-title text-center pb-25">
|
||||
<h2 class="title">Kontakt aufnehmen</h2>
|
||||
<!-- <p>Nunc id dui at sapien faucibus fermentum ut vel diam. Nullam tempus, nunc id efficitur sagittis, urna est ultricies eros, ac porta sem turpis quis leo.</p> -->
|
||||
</div> <!-- section title -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
<div class="row justify-content-center">
|
||||
<!-- <div class="col-lg-4 col-md-6 col-sm-7">
|
||||
<div class="contact-box text-center mt-30">
|
||||
<div class="contact-icon">
|
||||
<i class="lni-map-marker"></i>
|
||||
</div>
|
||||
<div class="contact-content">
|
||||
<h6 class="contact-title">Address</h6>
|
||||
<p>123 Stree New York City , United States Of America 750</p>
|
||||
</div> -->
|
||||
<!-- </div> contact box -->
|
||||
<!-- </div> -->
|
||||
<div class="col-lg-4 col-md-6 col-sm-7">
|
||||
<div class="contact-box text-center mt-30">
|
||||
<div class="contact-icon">
|
||||
<i class="lni-phone"></i>
|
||||
</div>
|
||||
<div class="contact-content">
|
||||
<h6 class="contact-title">Telefon</h6>
|
||||
<p>+49 (0) 6631 7095067</p>
|
||||
</div>
|
||||
</div> <!-- contact box -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-7">
|
||||
<div class="contact-box text-center mt-30">
|
||||
<div class="contact-icon">
|
||||
<i class="lni-envelope"></i>
|
||||
</div>
|
||||
<div class="contact-content">
|
||||
<h6 class="contact-title">E-Mail</h6>
|
||||
<p>mail@samuelzielke.de</p>
|
||||
</div>
|
||||
</div> <!-- contact box -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</section>
|
||||
|
||||
<!--====== CONTACT PART ENDS ======-->
|
||||
|
||||
<!--====== FOOTER PART START ======-->
|
||||
|
||||
<footer id="footer" class="footer-area">
|
||||
<div class="footer-copyright pb-20">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="copyright-text text-center pt-20">
|
||||
<p>Copyright © 2023 - Samuel Zielke.</p>
|
||||
<p style="color: gray; font-size: small;">The Website is based on a template, crafted by <a href="https://uideck.com" rel="nofollow">UIdeck</a></p>
|
||||
</div> <!-- copyright text -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</div> <!-- footer widget -->
|
||||
</footer>
|
||||
|
||||
<!--====== FOOTER PART ENDS ======-->
|
||||
|
||||
<!--====== BACK TOP TOP PART START ======-->
|
||||
|
||||
<a href="#" class="back-to-top"><i class="lni-chevron-up"></i></a>
|
||||
|
||||
<!--====== BACK TOP TOP PART ENDS ======-->
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--====== jquery js ======-->
|
||||
<script src="assets/js/vendor/modernizr-3.6.0.min.js"></script>
|
||||
<script src="assets/js/vendor/jquery-1.12.4.min.js"></script>
|
||||
|
||||
<!--====== Bootstrap js ======-->
|
||||
<script src="assets/js/bootstrap.min.js"></script>
|
||||
<script src="assets/js/popper.min.js"></script>
|
||||
|
||||
<!--====== Magnific Popup js ======-->
|
||||
<script src="assets/js/jquery.magnific-popup.min.js"></script>
|
||||
|
||||
<!--====== Parallax js ======-->
|
||||
<script src="assets/js/parallax.min.js"></script>
|
||||
|
||||
<!--====== Counter Up js ======-->
|
||||
<script src="assets/js/waypoints.min.js"></script>
|
||||
<script src="assets/js/jquery.counterup.min.js"></script>
|
||||
|
||||
|
||||
<!--====== Appear js ======-->
|
||||
<script src="assets/js/jquery.appear.min.js"></script>
|
||||
|
||||
<!--====== Scrolling js ======-->
|
||||
<script src="assets/js/scrolling-nav.js"></script>
|
||||
<script src="assets/js/jquery.easing.min.js"></script>
|
||||
|
||||
|
||||
<!--====== Main js ======-->
|
||||
<script src="assets/js/main.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -0,0 +1,13 @@
|
||||
Thanks for using the free lite version of Unfold. Please, consider purchasing the full version of Unfold to Enjoy All Features and Freedom to Use in Commercial Projects.
|
||||
|
||||
FOR FREE LITE VERSION:
|
||||
1. Commercial Use - Not Allowed
|
||||
2. Removing Footer Credit - Not Allowed
|
||||
3. Documentation - Not Available
|
||||
4. Support - Not Provided
|
||||
5. All Features - Not Available
|
||||
6. Personal Use - Allowed
|
||||
|
||||
To purchase commercial license please visit: https://uideck.com/products/unfold-free-personal-portfolio-and-profile-template and choose Full Template with commercial license.
|
||||
|
||||
Best regards
|
||||
@ -0,0 +1,384 @@
|
||||
<!--====== SERVICES PART START ======-->
|
||||
|
||||
|
||||
<section id="service" class="services-area gray-bg pt-125 pb-130">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-8">
|
||||
<div class="section-title text-center pb-30">
|
||||
<h2 class="title">My Services</h2>
|
||||
<p>Nunc id dui at sapien faucibus fermentum ut vel diam. Nullam tempus, nunc id efficitur sagittis, urna est ultricies eros, ac porta sem turpis quis leo.</p>
|
||||
</div> <!-- section title -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-4 col-md-6 col-sm-8">
|
||||
<div class="single-service text-center mt-30">
|
||||
<div class="service-icon">
|
||||
<i class="lni-code-alt"></i>
|
||||
</div>
|
||||
<div class="service-content">
|
||||
<h4 class="service-title"><a href="#">Web Design</a></h4>
|
||||
<p>Curabitur vitae magna felis. Nulla ac libero ornare, vestibulum lacus quis blandit enimdicta sunt.</p>
|
||||
</div>
|
||||
</div> <!-- single service -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-8">
|
||||
<div class="single-service text-center mt-30">
|
||||
<div class="service-icon">
|
||||
<i class="lni-color-pallet"></i>
|
||||
</div>
|
||||
<div class="service-content">
|
||||
<h4 class="service-title"><a href="#contact">Graphic Design</a></h4>
|
||||
<p>Curabitur vitae magna felis. Nulla ac libero ornare, vestibulum lacus quis blandit enimdicta sunt.</p>
|
||||
</div>
|
||||
</div> <!-- single service -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-8">
|
||||
<div class="single-service text-center mt-30">
|
||||
<div class="service-icon">
|
||||
<i class="lni-mobile"></i>
|
||||
</div>
|
||||
<div class="service-content">
|
||||
<h4 class="service-title"><a href="#">App Design</a></h4>
|
||||
<p>Curabitur vitae magna felis. Nulla ac libero ornare, vestibulum lacus quis blandit enimdicta sunt.</p>
|
||||
</div>
|
||||
</div> <!-- single service -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-8">
|
||||
<div class="single-service text-center mt-30">
|
||||
<div class="service-icon">
|
||||
<i class="lni-vector"></i>
|
||||
</div>
|
||||
<div class="service-content">
|
||||
<h4 class="service-title"><a href="#">Illustration Design</a></h4>
|
||||
<p>Curabitur vitae magna felis. Nulla ac libero ornare, vestibulum lacus quis blandit enimdicta sunt.</p>
|
||||
</div>
|
||||
</div> <!-- single service -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-8">
|
||||
<div class="single-service text-center mt-30">
|
||||
<div class="service-icon">
|
||||
<i class="lni-website"></i>
|
||||
</div>
|
||||
<div class="service-content">
|
||||
<h4 class="service-title"><a href="#">Web Development</a></h4>
|
||||
<p>Curabitur vitae magna felis. Nulla ac libero ornare, vestibulum lacus quis blandit enimdicta sunt.</p>
|
||||
</div>
|
||||
</div> <!-- single service -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-8">
|
||||
<div class="single-service text-center mt-30">
|
||||
<div class="service-icon">
|
||||
<i class="lni-support"></i>
|
||||
</div>
|
||||
<div class="service-content">
|
||||
<h4 class="service-title"><a href="#">Consultancy and Support</a></h4>
|
||||
<p>Curabitur vitae magna felis. Nulla ac libero ornare, vestibulum lacus quis blandit enimdicta sunt.</p>
|
||||
</div>
|
||||
</div> <!-- single service -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</section>
|
||||
|
||||
<!--====== SERVICES PART ENDS ======-->
|
||||
|
||||
<!--====== CALL TO ACTION PART START ======-->
|
||||
|
||||
<section id="call-to-action" class="call-to-action pt-125 pb-130 bg_cover" style="background-image: url(assets/images/call-to-action.jpg)">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-xl-8 col-lg-9">
|
||||
<div class="call-action-content text-center">
|
||||
<h2 class="action-title">Have any project on mind?</h2>
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua nostrud.</p>
|
||||
<ul>
|
||||
<li><a class="main-btn custom" href="#">download cv</a></li>
|
||||
<li><a class="main-btn custom-2" href="#">hire me</a></li>
|
||||
</ul>
|
||||
</div> <!-- call action content -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</section>
|
||||
|
||||
<!--====== CALL TO ACTION PART ENDS ======-->
|
||||
|
||||
<!--====== WORK PART START ======-->
|
||||
|
||||
<section id="work" class="work-area pt-125 pb-130">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-8">
|
||||
<div class="section-title pb-25">
|
||||
<h2 class="title">My Recent Works</h2>
|
||||
<p>Nunc id dui at sapien faucibus fermentum ut vel diam. Nullam tempus, nunc id efficitur sagittis, urna est ultricies eros, ac porta sem turpis quis leo.</p>
|
||||
</div> <!-- section title -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
<div class="row">
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="single-work text-center mt-30">
|
||||
<div class="work-image">
|
||||
<img src="assets/images/work/w-1.jpg" alt="work">
|
||||
</div>
|
||||
<div class="work-overlay">
|
||||
<div class="work-content">
|
||||
<h3 class="work-title">Product Design</h3>
|
||||
<ul>
|
||||
<li><a class="image-popup" href="assets/images/work/w-1.jpg"><i class="lni-plus"></i></a></li>
|
||||
<li><a href="#"><i class="lni-link"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- single work -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="single-work text-center mt-30">
|
||||
<div class="work-image">
|
||||
<img src="assets/images/work/w-2.jpg" alt="work">
|
||||
</div>
|
||||
<div class="work-overlay">
|
||||
<div class="work-content">
|
||||
<h3 class="work-title">Product Design</h3>
|
||||
<ul>
|
||||
<li><a class="image-popup" href="assets/images/work/w-2.jpg"><i class="lni-plus"></i></a></li>
|
||||
<li><a href="#"><i class="lni-link"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- single work -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="single-work text-center mt-30">
|
||||
<div class="work-image">
|
||||
<img src="assets/images/work/w-3.jpg" alt="work">
|
||||
</div>
|
||||
<div class="work-overlay">
|
||||
<div class="work-content">
|
||||
<h3 class="work-title">Product Design</h3>
|
||||
<ul>
|
||||
<li><a class="image-popup" href="assets/images/work/w-3.jpg"><i class="lni-plus"></i></a></li>
|
||||
<li><a href="#"><i class="lni-link"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- single work -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="single-work text-center mt-30">
|
||||
<div class="work-image">
|
||||
<img src="assets/images/work/w-4.jpg" alt="work">
|
||||
</div>
|
||||
<div class="work-overlay">
|
||||
<div class="work-content">
|
||||
<h3 class="work-title">Product Design</h3>
|
||||
<ul>
|
||||
<li><a class="image-popup" href="assets/images/work/w-4.jpg"><i class="lni-plus"></i></a></li>
|
||||
<li><a href="#"><i class="lni-link"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- single work -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="single-work text-center mt-30">
|
||||
<div class="work-image">
|
||||
<img src="assets/images/work/w-5.jpg" alt="work">
|
||||
</div>
|
||||
<div class="work-overlay">
|
||||
<div class="work-content">
|
||||
<h3 class="work-title">Product Design</h3>
|
||||
<ul>
|
||||
<li><a class="image-popup" href="assets/images/work/w-5.jpg"><i class="lni-plus"></i></a></li>
|
||||
<li><a href="#"><i class="lni-link"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- single work -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="single-work text-center mt-30">
|
||||
<div class="work-image">
|
||||
<img src="assets/images/work/w-6.jpg" alt="work">
|
||||
</div>
|
||||
<div class="work-overlay">
|
||||
<div class="work-content">
|
||||
<h3 class="work-title">Product Design</h3>
|
||||
<ul>
|
||||
<li><a class="image-popup" href="assets/images/work/w-6.jpg"><i class="lni-plus"></i></a></li>
|
||||
<li><a href="#"><i class="lni-link"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- single work -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="work-more text-center mt-50">
|
||||
<a class="main-btn" href="#">more works</a>
|
||||
</div> <!-- work more -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</section>
|
||||
|
||||
<!--====== WORK PART ENDS ======-->
|
||||
|
||||
<!--====== PRICING PART START ======-->
|
||||
|
||||
<section id="pricing" class="pricing-area gray-bg pt-125 pb-130">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-8">
|
||||
<div class="section-title text-center pb-25">
|
||||
<h2 class="title">My Pricing Plans</h2>
|
||||
<p>Nunc id dui at sapien faucibus fermentum ut vel diam. Nullam tempus, nunc id efficitur sagittis, urna est ultricies eros, ac porta sem turpis quis leo.</p>
|
||||
</div> <!-- section title -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-4 col-md-8 col-sm-9">
|
||||
<div class="single-pricing text-center mt-30">
|
||||
<div class="pricing-package">
|
||||
<h4 class="package-title">Basic</h4>
|
||||
</div>
|
||||
<div class="pricing-body">
|
||||
<div class="pricing-text">
|
||||
<p>Simple project management for teams and small businesses.</p>
|
||||
<span class="price">$19.00</span>
|
||||
</div>
|
||||
<div class="pricing-list">
|
||||
<ul>
|
||||
<li>Unlimited Tasks</li>
|
||||
<li>Unlimited Public</li>
|
||||
<li>Private Projects</li>
|
||||
<li>Unlimited Teams</li>
|
||||
<li>All Integrations</li>
|
||||
<li>Public API</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="pricing-btn">
|
||||
<a class="main-btn" href="#contact">get quote</a>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- single pricing -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-8 col-sm-9">
|
||||
<div class="single-pricing active text-center mt-30">
|
||||
<div class="pricing-package">
|
||||
<h4 class="package-title">Standard</h4>
|
||||
</div>
|
||||
<div class="pricing-body">
|
||||
<div class="pricing-text">
|
||||
<p>Simple project management for teams and small businesses.</p>
|
||||
<span class="price">$39.00</span>
|
||||
</div>
|
||||
<div class="pricing-list">
|
||||
<ul>
|
||||
<li>Unlimited Tasks</li>
|
||||
<li>Unlimited Public</li>
|
||||
<li>Private Projects</li>
|
||||
<li>Unlimited Teams</li>
|
||||
<li>All Integrations</li>
|
||||
<li>Public API</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="pricing-btn">
|
||||
<a class="main-btn" href="#contact">get quote</a>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- single pricing -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-8 col-sm-9">
|
||||
<div class="single-pricing text-center mt-30">
|
||||
<div class="pricing-package">
|
||||
<h4 class="package-title">Premium</h4>
|
||||
</div>
|
||||
<div class="pricing-body">
|
||||
<div class="pricing-text">
|
||||
<p>Simple project management for teams and small businesses.</p>
|
||||
<span class="price">$29.00</span>
|
||||
</div>
|
||||
<div class="pricing-list">
|
||||
<ul>
|
||||
<li>Unlimited Tasks</li>
|
||||
<li>Unlimited Public</li>
|
||||
<li>Private Projects</li>
|
||||
<li>Unlimited Teams</li>
|
||||
<li>All Integrations</li>
|
||||
<li>Public API</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="pricing-btn">
|
||||
<a class="main-btn" href="#contact">get quote</a>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- single pricing -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</section>
|
||||
|
||||
<!--====== PRICING PART ENDS ======-->
|
||||
|
||||
<!--====== BLOG PART START ======-->
|
||||
|
||||
<section id="blog" class="blog-area pt-125 pb-130">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-8">
|
||||
<div class="section-title text-center pb-25">
|
||||
<h2 class="title">From The Blog</h2>
|
||||
<p>Nunc id dui at sapien faucibus fermentum ut vel diam. Nullam tempus, nunc id efficitur sagittis, urna est ultricies eros, ac porta sem turpis quis leo.</p>
|
||||
</div> <!-- section title -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-4 col-md-8 col-sm-9">
|
||||
<div class="single-blog mt-30">
|
||||
<div class="blog-image">
|
||||
<img src="assets/images/blog/b-1.jpg" alt="Blog">
|
||||
</div>
|
||||
<div class="blog-content">
|
||||
<h4 class="blog-title"><a href="#">Hired Releases 2023 Brand Health.</a></h4>
|
||||
<span>July 26, 2022</span>
|
||||
</div>
|
||||
</div> <!-- single blog -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-8 col-sm-9">
|
||||
<div class="single-blog mt-30">
|
||||
<div class="blog-image">
|
||||
<img src="assets/images/blog/b-2.jpg" alt="Blog">
|
||||
</div>
|
||||
<div class="blog-content">
|
||||
<h4 class="blog-title"><a href="#">Hired Releases 2023 Brand Health.</a></h4>
|
||||
<span>July 26, 2022</span>
|
||||
</div>
|
||||
</div> <!-- single blog -->
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-8 col-sm-9">
|
||||
<div class="single-blog mt-30">
|
||||
<div class="blog-image">
|
||||
<img src="assets/images/blog/b-3.jpg" alt="Blog">
|
||||
</div>
|
||||
<div class="blog-content">
|
||||
<h4 class="blog-title"><a href="#">Hired Releases 2023 Brand Health.</a></h4>
|
||||
<span>July 26, 2022</span>
|
||||
</div>
|
||||
</div> <!-- single blog -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="blog-more text-center mt-50">
|
||||
<a class="main-btn" href="#">More posts</a>
|
||||
</div> <!-- blog more -->
|
||||
</div>
|
||||
</div> <!-- row -->
|
||||
</div> <!-- container -->
|
||||
</section>
|
||||
|
||||
<!--====== BLOG PART ENDS ======-->
|
||||