forked from oyd/kendibaglantim-neo
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.
573 lines
10 KiB
573 lines
10 KiB
5 years ago
|
.social-media .social-media-box a .twitter:focus, .social-media .social-media-box a .twitter:hover, .social-media .social-media-box a:focus, .social-media .social-media-box a:hover, a {
|
||
|
text-decoration: none;
|
||
|
}
|
||
|
a, abbr, acronym, address, applet, article, aside, audio, big, blockquote, body, button, canvas, caption, cite, code, dd, del, details, dfn, div, dl, dt, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, iframe, img, input, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, select, small, span, strike, sub, summary, sup, table, tbody, td, textarea, tfoot, th, thead, time, tr, tt, ul, var, video {
|
||
|
margin: 0;
|
||
|
padding: 0;
|
||
|
border: 0;
|
||
|
font: inherit;
|
||
|
vertical-align: baseline;
|
||
|
}
|
||
|
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
|
||
|
display: block;
|
||
|
}
|
||
|
ol, ul {
|
||
|
list-style: none;
|
||
|
}
|
||
|
blockquote, q {
|
||
|
quotes: none;
|
||
|
}
|
||
|
blockquote:after, blockquote:before, q:after, q:before {
|
||
|
content: '';
|
||
|
content: none;
|
||
|
}
|
||
|
table {
|
||
|
border-collapse: collapse;
|
||
|
border-spacing: 0;
|
||
|
}
|
||
|
img {
|
||
|
border: 0;
|
||
|
}
|
||
|
:focus {
|
||
|
outline: 0;
|
||
|
}
|
||
|
.full-width {
|
||
|
width: 100%;
|
||
|
float: left;
|
||
|
}
|
||
|
.hidden-element {
|
||
|
opacity: 0;
|
||
|
filter: alpha(opacity=0);
|
||
|
visibility: hidden;
|
||
|
}
|
||
|
.visible-element {
|
||
|
opacity: 1;
|
||
|
filter: alpha(opacity=100);
|
||
|
visibility: visible;
|
||
|
}
|
||
|
.border-box {
|
||
|
-webkit-box-sizing: border-box;
|
||
|
-moz-box-sizing: border-box;
|
||
|
-ms-box-sizing: border-box;
|
||
|
-o-box-sizing: border-box;
|
||
|
box-sizing: border-box;
|
||
|
}
|
||
|
.inline-block {
|
||
|
display: inline-block;
|
||
|
zoom: 1;
|
||
|
*display: inline;
|
||
|
}
|
||
|
.transition-bg {
|
||
|
-webkit-transition: background .3s ease;
|
||
|
-moz-transition: background .3s ease;
|
||
|
-ms-transition: background .3s ease;
|
||
|
-o-transition: background .3s ease;
|
||
|
transition: background .3s ease;
|
||
|
}
|
||
|
.transition-color {
|
||
|
-webkit-transition: color .3s ease;
|
||
|
-moz-transition: color .3s ease;
|
||
|
-ms-transition: color .3s ease;
|
||
|
-o-transition: color .3s ease;
|
||
|
transition: color .3s ease;
|
||
|
}
|
||
|
.no-padding {
|
||
|
padding: 0!important;
|
||
|
}
|
||
|
.padding-5 {
|
||
|
padding: 5px!important;
|
||
|
}
|
||
|
.padding-10 {
|
||
|
padding: 10px!important;
|
||
|
}
|
||
|
.padding-15 {
|
||
|
padding: 15px!important;
|
||
|
}
|
||
|
.padding-20 {
|
||
|
padding: 20px!important;
|
||
|
}
|
||
|
.padding-25 {
|
||
|
padding: 25px!important;
|
||
|
}
|
||
|
.padding-30 {
|
||
|
padding: 30px!important;
|
||
|
}
|
||
|
.p-r-0 {
|
||
|
padding-right: 0!important;
|
||
|
}
|
||
|
.p-r-5 {
|
||
|
padding-right: 5px!important;
|
||
|
}
|
||
|
.p-r-10 {
|
||
|
padding-right: 10px!important;
|
||
|
}
|
||
|
.p-r-15 {
|
||
|
padding-right: 15px!important;
|
||
|
}
|
||
|
.p-r-20 {
|
||
|
padding-right: 20px!important;
|
||
|
}
|
||
|
.p-r-25 {
|
||
|
padding-right: 25px!important;
|
||
|
}
|
||
|
.p-r-30 {
|
||
|
padding-right: 30px!important;
|
||
|
}
|
||
|
.p-l-0 {
|
||
|
padding-left: 0!important;
|
||
|
}
|
||
|
.p-l-5 {
|
||
|
padding-left: 5px!important;
|
||
|
}
|
||
|
.p-l-10 {
|
||
|
padding-left: 10px!important;
|
||
|
}
|
||
|
.p-l-15 {
|
||
|
padding-left: 15px!important;
|
||
|
}
|
||
|
.p-l-20 {
|
||
|
padding-left: 20px!important;
|
||
|
}
|
||
|
.p-l-25 {
|
||
|
padding-left: 25px!important;
|
||
|
}
|
||
|
.p-l-30 {
|
||
|
padding-left: 30px!important;
|
||
|
}
|
||
|
.p-t-0 {
|
||
|
padding-top: 0!important;
|
||
|
}
|
||
|
.p-t-5 {
|
||
|
padding-top: 5px!important;
|
||
|
}
|
||
|
.p-t-10 {
|
||
|
padding-top: 10px!important;
|
||
|
}
|
||
|
.p-t-15 {
|
||
|
padding-top: 15px!important;
|
||
|
}
|
||
|
.p-t-20 {
|
||
|
padding-top: 20px!important;
|
||
|
}
|
||
|
.p-t-25 {
|
||
|
padding-top: 25px!important;
|
||
|
}
|
||
|
.p-t-30 {
|
||
|
padding-top: 30px!important;
|
||
|
}
|
||
|
.p-b-0 {
|
||
|
padding-bottom: 0!important;
|
||
|
}
|
||
|
.p-b-5 {
|
||
|
padding-bottom: 5px!important;
|
||
|
}
|
||
|
.p-b-10 {
|
||
|
padding-bottom: 10px!important;
|
||
|
}
|
||
|
.p-b-15 {
|
||
|
padding-bottom: 15px!important;
|
||
|
}
|
||
|
.p-b-20 {
|
||
|
padding-bottom: 20px!important;
|
||
|
}
|
||
|
.p-b-25 {
|
||
|
padding-bottom: 25px!important;
|
||
|
}
|
||
|
.p-b-30 {
|
||
|
padding-bottom: 30px!important;
|
||
|
}
|
||
|
.no-margin {
|
||
|
margin: 0!important;
|
||
|
}
|
||
|
.m-r-0 {
|
||
|
margin-right: 0!important;
|
||
|
}
|
||
|
.m-r-5 {
|
||
|
margin-right: 5px!important;
|
||
|
}
|
||
|
.m-r-10 {
|
||
|
margin-right: 10px!important;
|
||
|
}
|
||
|
.m-r-15 {
|
||
|
margin-right: 15px!important;
|
||
|
}
|
||
|
.m-r-20 {
|
||
|
margin-right: 20px!important;
|
||
|
}
|
||
|
.m-r-25 {
|
||
|
margin-right: 25px!important;
|
||
|
}
|
||
|
.m-r-30 {
|
||
|
margin-right: 30px!important;
|
||
|
}
|
||
|
.m-l-0 {
|
||
|
margin-left: 0!important;
|
||
|
}
|
||
|
.m-l-5 {
|
||
|
margin-left: 5px!important;
|
||
|
}
|
||
|
.m-l-10 {
|
||
|
margin-left: 10px!important;
|
||
|
}
|
||
|
.m-l-15 {
|
||
|
margin-left: 15px!important;
|
||
|
}
|
||
|
.m-l-20 {
|
||
|
margin-left: 20px!important;
|
||
|
}
|
||
|
.m-l-25 {
|
||
|
margin-left: 25px!important;
|
||
|
}
|
||
|
.m-l-30 {
|
||
|
margin-left: 30px!important;
|
||
|
}
|
||
|
.m-t-0 {
|
||
|
margin-top: 0!important;
|
||
|
}
|
||
|
.m-t-5 {
|
||
|
margin-top: 5px!important;
|
||
|
}
|
||
|
.m-t-10 {
|
||
|
margin-top: 10px!important;
|
||
|
}
|
||
|
.m-t-15 {
|
||
|
margin-top: 15px!important;
|
||
|
}
|
||
|
.m-t-20 {
|
||
|
margin-top: 20px!important;
|
||
|
}
|
||
|
.m-t-25 {
|
||
|
margin-top: 25px!important;
|
||
|
}
|
||
|
.m-t-30 {
|
||
|
margin-top: 30px!important;
|
||
|
}
|
||
|
.faq, .features, .tutorial {
|
||
|
margin-top: 40px;
|
||
|
}
|
||
|
.m-b-0 {
|
||
|
margin-bottom: 0!important;
|
||
|
}
|
||
|
.m-b-5 {
|
||
|
margin-bottom: 5px!important;
|
||
|
}
|
||
|
.m-b-10 {
|
||
|
margin-bottom: 10px!important;
|
||
|
}
|
||
|
.m-b-15 {
|
||
|
margin-bottom: 15px!important;
|
||
|
}
|
||
|
.m-b-20 {
|
||
|
margin-bottom: 20px!important;
|
||
|
}
|
||
|
.m-b-25 {
|
||
|
margin-bottom: 25px!important;
|
||
|
}
|
||
|
.m-b-30 {
|
||
|
margin-bottom: 30px!important;
|
||
|
}
|
||
|
.b-b {
|
||
|
border-bottom: 1px solid #f4f6f7;
|
||
|
}
|
||
|
.b-l {
|
||
|
border-left: 1px solid #f4f6f7;
|
||
|
}
|
||
|
.b-r {
|
||
|
border-right: 1px solid #f4f6f7;
|
||
|
}
|
||
|
.b-t {
|
||
|
border-top: 1px solid #f4f6f7;
|
||
|
}
|
||
|
.b-black {
|
||
|
border-color: #000!important;
|
||
|
}
|
||
|
.b-1 {
|
||
|
border: 1px solid #f4f6f7;
|
||
|
}
|
||
|
.b-2 {
|
||
|
border: 2px solid #f4f6f7;
|
||
|
}
|
||
|
.b-3 {
|
||
|
border: 3px solid #f4f6f7;
|
||
|
}
|
||
|
.b-4 {
|
||
|
border: 4px solid #f4f6f7;
|
||
|
}
|
||
|
.b-5 {
|
||
|
border: 5px solid #f4f6f7;
|
||
|
}
|
||
|
.b-main {
|
||
|
border-color: #377eba!important;
|
||
|
}
|
||
|
.b-second {
|
||
|
border-color: #c40f17!important;
|
||
|
}
|
||
|
.fs-10 {
|
||
|
font-size: 10px!important;
|
||
|
}
|
||
|
.fs-11 {
|
||
|
font-size: 11px!important;
|
||
|
}
|
||
|
.fs-12 {
|
||
|
font-size: 12px!important;
|
||
|
}
|
||
|
.fs-13 {
|
||
|
font-size: 13px!important;
|
||
|
}
|
||
|
.fs-14 {
|
||
|
font-size: 14px!important;
|
||
|
}
|
||
|
.fs-15 {
|
||
|
font-size: 15px!important;
|
||
|
}
|
||
|
.fs-16 {
|
||
|
font-size: 16px!important;
|
||
|
}
|
||
|
.fs-17 {
|
||
|
font-size: 17px!important;
|
||
|
}
|
||
|
.fs-18 {
|
||
|
font-size: 18px!important;
|
||
|
}
|
||
|
.text-uppercase {
|
||
|
text-transform: uppercase!important;
|
||
|
}
|
||
|
.text-bold {
|
||
|
font-weight: 700!important;
|
||
|
}
|
||
|
.text-normal {
|
||
|
font-weight: 400!important;
|
||
|
}
|
||
|
.text-main {
|
||
|
font-family: Poppins, sans-serif!important;
|
||
|
}
|
||
|
.text-second {
|
||
|
font-family: "Work Sans", sans-serif!important;
|
||
|
}
|
||
|
.text-main-color {
|
||
|
color: #377eba!important;
|
||
|
}
|
||
|
.text-second-color {
|
||
|
color: #c40f17!important;
|
||
|
}
|
||
|
.clear {
|
||
|
clear: both;
|
||
|
}
|
||
|
body {
|
||
|
font-family: "Work Sans", sans-serif;
|
||
|
font-size: 14px;
|
||
|
color: #353535;
|
||
|
background-color: #fff;
|
||
|
}
|
||
|
.main {
|
||
|
position: relative;
|
||
|
width: 100%}
|
||
|
textarea {
|
||
|
resize: none;
|
||
|
}
|
||
|
.features {
|
||
|
margin-bottom: 40px;
|
||
|
padding-top: 40px;
|
||
|
}
|
||
|
.features .features-box {
|
||
|
background: #ddd;
|
||
|
min-height: 250px;
|
||
|
margin-bottom: 30px;
|
||
|
text-align: center;
|
||
|
padding: 30px 15px;
|
||
|
}
|
||
|
.features .features-box h2 {
|
||
|
padding-top: 20px;
|
||
|
padding-bottom: 20px;
|
||
|
font-size: 24px;
|
||
|
}
|
||
|
.features .features-box p {
|
||
|
font-size: 15px;
|
||
|
line-height: 22px;
|
||
|
}
|
||
|
.video {
|
||
|
background: linear-gradient(rgba(0, 0, 0, .8), rgba(0, 0, 0, .8)), url(../img/main.jpeg);
|
||
|
background-repeat: no-repeat;
|
||
|
color: #fff;
|
||
|
background-position: center center;
|
||
|
background-size: cover;
|
||
|
min-height: 200px;
|
||
|
padding-top: 40px;
|
||
|
padding-bottom: 40px;
|
||
|
}
|
||
|
.video .video-title {
|
||
|
font-size: 32px;
|
||
|
line-height: 42px;
|
||
|
padding-bottom: 20px;
|
||
|
}
|
||
|
.video .setup-steps {
|
||
|
padding-top: 10px;
|
||
|
padding-bottom: 10px;
|
||
|
}
|
||
|
.video .setup-steps p {
|
||
|
font-size: 22px;
|
||
|
line-height: 24px;
|
||
|
}
|
||
|
.video .setup-steps p span {
|
||
|
display: inline-block;
|
||
|
color: #000;
|
||
|
background: #fcfcfc;
|
||
|
padding: 10px;
|
||
|
margin-right: 10px;
|
||
|
font-size: 16px;
|
||
|
text-align: center;
|
||
|
font-style: italic;
|
||
|
text-decoration: none;
|
||
|
}
|
||
|
.video p {
|
||
|
line-height: 28px;
|
||
|
font-size: 16px;
|
||
|
padding-bottom: 20px;
|
||
|
}
|
||
|
.social-media .social-media-box {
|
||
|
padding: 0;
|
||
|
}
|
||
|
.social-media .social-media-box a .facebook {
|
||
|
background: #3B5998;
|
||
|
height: 80px;
|
||
|
line-height: 80px;
|
||
|
text-align: center;
|
||
|
font-size: 20px;
|
||
|
color: #fff;
|
||
|
}
|
||
|
.social-media .social-media-box a .twitter {
|
||
|
background: #00aced;
|
||
|
height: 80px;
|
||
|
line-height: 80px;
|
||
|
text-align: center;
|
||
|
font-size: 20px;
|
||
|
color: #fff;
|
||
|
}
|
||
|
.faq .faq-title {
|
||
|
font-size: 32px;
|
||
|
padding-bottom: 40px;
|
||
|
}
|
||
|
.faq .panel {
|
||
|
margin-bottom: 20px!important;
|
||
|
}
|
||
|
.faq .panel .panel-heading {
|
||
|
padding: 20px;
|
||
|
}
|
||
|
section.devices {
|
||
|
padding: 40px 0;
|
||
|
text-align: center;
|
||
|
}
|
||
|
section.devices h1 {
|
||
|
font-size: 24px;
|
||
|
margin-bottom: 20px;
|
||
|
}
|
||
|
section.devices img {
|
||
|
margin-left: 10px;
|
||
|
margin-right: 10px;
|
||
|
}
|
||
|
.videoWrapper {
|
||
|
position: relative;
|
||
|
padding-bottom: 61.5%;
|
||
|
padding-top: 25px;
|
||
|
height: 0;
|
||
|
}
|
||
|
.tutorial .content h2, .tutorial .content p {
|
||
|
color: #353535;
|
||
|
padding-top: 10px;
|
||
|
padding-bottom: 10px;
|
||
|
}
|
||
|
.videoWrapper iframe {
|
||
|
position: absolute;
|
||
|
top: 0;
|
||
|
left: 0;
|
||
|
width: 100%;
|
||
|
height: 100%}
|
||
|
.tutorial {
|
||
|
margin-bottom: 40px;
|
||
|
}
|
||
|
.tutorial .content h1 {
|
||
|
font-size: 32px;
|
||
|
color: #353535;
|
||
|
padding-bottom: 10px;
|
||
|
}
|
||
|
.tutorial .content h2 {
|
||
|
font-size: 22px;
|
||
|
}
|
||
|
.tutorial .content p {
|
||
|
font-size: 15px;
|
||
|
line-height: 26px;
|
||
|
}
|
||
|
.tutorial .content iframe {
|
||
|
float: right;
|
||
|
margin: 20px;
|
||
|
border: 2px solid #212121;
|
||
|
}
|
||
|
.tutorial .content pre {
|
||
|
display: block;
|
||
|
padding: 9.5px;
|
||
|
margin: 0 0 10px;
|
||
|
font-size: 13px;
|
||
|
line-height: 1.42857143;
|
||
|
color: #333;
|
||
|
word-break: break-all;
|
||
|
word-wrap: break-word;
|
||
|
background-color: #f5f5f5;
|
||
|
border: 1px solid #ccc;
|
||
|
border-radius: 4px;
|
||
|
}
|
||
|
.tutorial .content ul li {
|
||
|
list-style: disc;
|
||
|
padding-bottom: 10px;
|
||
|
}
|
||
|
.navbar {
|
||
|
border: 0;
|
||
|
padding: 15px 0;
|
||
|
margin: 0;
|
||
|
background: #ddd;
|
||
|
font-size: 16px;
|
||
|
color: #fff;
|
||
|
}
|
||
|
header {
|
||
|
min-height: 500px;
|
||
|
background: linear-gradient(rgba(0, 0, 0, .7), rgba(2, 19, 0, .4)), url(../img/kendibaglantim-mutlu-adam.jpg);
|
||
|
background-repeat: no-repeat;
|
||
|
background-position: center center;
|
||
|
background-size: cover;
|
||
|
color: #fff;
|
||
|
padding-bottom: 40px;
|
||
|
text-align: center;
|
||
|
padding-top: 40px;
|
||
|
}
|
||
|
header .header-center-title {
|
||
|
padding-top: 30px;
|
||
|
font-size: 48px;
|
||
|
padding-bottom: 20px;
|
||
|
}
|
||
|
header p {
|
||
|
font-size: 24px;
|
||
|
line-height: 36px;
|
||
|
padding-bottom: 20px;
|
||
|
width: 65%;
|
||
|
margin: 0 auto;
|
||
|
}
|
||
|
header .start-button {
|
||
|
margin-bottom: 30px;
|
||
|
font-size: 24px;
|
||
|
}
|
||
|
header a.more-info {
|
||
|
color: #fff;
|
||
|
font-size: 16px;
|
||
|
}
|
||
|
header a.more-info:active, header a.more-info:focus, header a.more-info:hover {
|
||
|
color: #ccc;
|
||
|
}
|
||
|
.footer, .footer a {
|
||
|
color: #fff;
|
||
|
}
|
||
|
.footer {
|
||
|
width: 100%;
|
||
|
background: #1d1f25;
|
||
|
padding: 40px 0;
|
||
|
position: relative;
|
||
|
}
|