@import url('jquery.fancybox.min.css'); ::-webkit-scrollbar{     background-color: #fff;     width: 10px;} ::-webkit-scrollbar-thumb{     background-color: #2daae1;} ::selection{     color: #3b3838;     background-color: #2daae1;} *{     margin: 0px;     padding: 0px;     border: none;     outline: none;     font-size: 14px;} body{     margin: 0px;     padding: 0px;     color: #3b3838;     font-size: 14px;     font-family: 'Titillium Web', sans-serif;     font-weight: 500;     overflow-x: hidden;}/**========================= END BODY =========================**//**========================= START COMMON =========================**/ a, a:hover{     color: #3b3838;     text-decoration: none;     outline: none;     transition:all 0.4s;     -webkit-transition:all 0.4s;     -moz-transition:all 0.4s;     -o-transition:all 0.4s;} h1, h2, h3, h4, h5, h6{     color: #3b3838;     margin-bottom: 16px;} p{     line-height: 26px;     font-family: 'Titillium Web', sans-serif;} li{     color: #3b3838;     list-style: none;} span, b, strong{     font-size: 100%;} b, strong{     font-weight: 900;}/* Iframe */ iframe{     width: 100%;     height: 400px;     border: 0;     outline: 0;     overflow: hidden;} img{     max-width:100%;}/* Loader */ .loader{     position: fixed;     left: 0px;     top: 0px;     width: 100%;     height: 100%;     z-index: 999999;     background-color: #fff;     text-align: center;} .loader img {     position: absolute;     top: 0;     bottom: 0;     left: 0;     right: 0;     margin: auto;}/* Padding */ .p-30{     padding: 30px !important;} .ptb-20{     padding: 20px 0px;} .ptb-40{     padding: 40px 0px;} .ptb-60{     padding: 60px 0px;} .ptb-80{     padding: 80px 0px;} .ptb-100{     padding: 100px 0px;} .ptb-120{     padding: 120px 0px;} .ptb-140{     padding: 140px 0px;} .ptb-80-40{     padding: 80px 0px 40px;} .ptb-80-60{     padding: 80px 0px 60px;} .ptb-60-60{     padding: 60px 0px 60px;} .pt-30px{     padding-top: 30px;} .pb-30px{     padding-bottom: 30px;}/* Margin */ .ml-10{     margin-left: 10px;} .mr-10{     margin-right: 10px;}/* Btn */ button, button:focus, button:active, button:hover{     box-shadow: 0 0 0 0;     outline: 0;} .input-btn, .input-btn:hover, .input-btn:active, .input-btn.active, .input-btn.active:hover, .input-btn.active:focus{     outline: 0;     box-shadow: 0 0 0 0;     background-color: transparent;} .btn, .page-link{     padding: 12px 25px;     border-radius: 5px;     box-shadow: 0 0 0 0;     outline: 0;} .btn-xl{     padding: 15px 40px;} .btn-sm{     padding: .25rem .5rem;     box-shadow: 0 0 0 0;     outline: 0;} .page-item.active .page-link{     background-color: #2daae1;     border-color: #2daae1;     color: #2c464f;} .btn-primary, .badge-primary, .dropdown-item.active, .dropdown-item:active, .nav-pills .nav-link.active, .nav-pills .show>.nav-link{     color: #fff;     background-color: #2daae1;     box-shadow: 0 0 0 0;     outline: 0;     border-color: #2daae1;} .btn-primary:hover, .btn-primary:active, .btn-primary:focus, .btn-primary.focus, .btn-primary.disabled, .btn-primary:disabled, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle, .btn-light.focus, .btn-light:focus{     color: #2daae1;     border-color: #3b3838;     outline: 0 !important;     box-shadow: 0 0 0 0 !important;     background-color: #3b3838;} .select-scroll .dropdown-item.active:hover, .select-scroll .dropdown-item:active:hover{     background-color: #2daae1;     color: #fff;} .btn-active{     background-color: #3b3838;     color: #2daae1;} .btn-border{     color: #3b3838;     border: 1px solid #3b3838;} .btn-border:hover{     color: #fff;     background-color:#3b3838;} .btn-white{     color: #3b3838;     background-color: #fff;} .btn-white:hover{     color: #2daae1;     background-color: #3b3838;} .btn-secondary{     background-color: #3b3838;     border-color: #3b3838;} .btn-secondary:hover{     background-color: #335763;     border-color: #335763;} .badge{     border-radius: 0;}/* Pagination */ .pagination {     display: block;} .pagination .page-link{     color: #2c464f;     outline: 0;     box-shadow: 0 0 0 0;} .pagination .page-item{     margin-right: 7px;     display: inline-block;} .pagination-btn nav{     display: inline-block;}/* Colors */ .color-white{     color: #fff;} .color-secondary{     color: #3b3838;} .color-black{     color: #222222;} .color-primary{     color: #2daae1;} .color-success{     color: #6ac059;} .color-info{     color: #10aad6;} .color-warning{     color: #ebde4b;} .color-danger{     color: #eb5454;}/* Heading Border Bottom */ .head-after{     position: relative;     display: inline-block;} .head-after:before{     content: "";     position: absolute;     background-color: #2daae1;     width: 25%;     height: 2px;     left: 0px;     bottom: -10px;}/* Images */ .img-bg{     position: relative;     margin-bottom: 1rem;} .img-bg-1 img{     width: auto;     border-radius: 5px;     border-bottom: 10px solid #2c464f;} .img-bg-2 img{     width: 320px;     height: auto;     position: absolute;     left: 0;     bottom: 0;     border: 20px solid rgba(255, 255, 255, 1);}/* Icons */ .social-icons a{     background: #2daae1;     border-radius: 5px;     margin: 0px auto;     width: 35px;     height: 35px;     line-height: 33px;     display: inline-block;     text-align: center;     color: #fff;     display: inline-block;     text-align: center;     white-space: nowrap;     vertical-align: middle;     -webkit-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;     border: 1px solid transparent;} .social-icons a:hover{     background-color: #3b3838;} .social-icons a:hover i{     color: #fff;}/* Bg */ .white-bg{     background-color: #ffffff;} .light-bg{     background-color: #eeeeee;} .primary-bg{     background-color: #2daae1;} .secondary-bg{     background-color: #3b3838;}/* Blockquote */ blockquote{     font-style: italic;     border-left: 5px solid #2daae1;     padding: 10px 20px;}/* Card */ .card{     width: 100%;     border-radius: 5px;     padding: 30px;     margin-bottom: 2rem;     border: 10px solid transparent;     display: inline-block;     box-shadow: 0px 0px 20px 0px rgba(62, 62, 101, 0.13);     transition:all 0.4s;     -webkit-transition:all 0.4s;     -moz-transition:all 0.4s;     -o-transition:all 0.4s;} .card:hover, .card-active{     border-bottom: 10px solid #2daae1;     box-shadow: 0px 0px 20px 10px rgba(62, 62, 101, 0.1);}/* Form Control */ ::placeholder{     color: #666 !important;} :-ms-input-placeholder{     color: #666 !important;} ::-ms-input-placeholder{     color: #666 !important;} .form-control, select, select.form-control:not([size]):not([multiple]){     border-radius: 5px;     padding: 12px 25px;     height: auto;     font-size: 14px;     outline: 0 !important;     box-shadow: 0 0 0 0 !important;     border: 2px solid rgba(44, 70, 79, 0.2);     color: #3b3838;} .form-control:focus, .form-control:active{     outline: 0;     box-shadow: 0 0 0 0;     border: 2px solid rgba(44, 70, 79, 0.2);     border-bottom: 2px solid #2daae1;} .center-form{     width: 50%;     text-align: center;     margin: 0px auto;} .input-group-prepend{     width: 100%;} .input-group .input-group-prepend .btn{     padding: 0px 25px;     border-radius: 5px;}/* Theme Row */ .t-row{     margin-left: -15px;     margin-right: -15px;}/* Border */ .border-bottom-light{     border-bottom: 1px solid #ddd;}/* Icons */ .mdi-bg{     font-size: 40px;     background: #2daae1;     color: #fff;     width: 60px;     height: 60px;     display: inline-block;     line-height: 60px;     text-align: center;     transition:all 0.4s;     -webkit-transition:all 0.4s;     -moz-transition:all 0.4s;     -o-transition:all 0.4s;} .mdi-30px{     font-size: 30px;} .mdi-40px{     font-size: 40px;} .mdi-60px{     font-size: 60px;} .mdi-80px{     font-size: 80px;} .mdi-100px{     font-size: 100px;}/* Collapse */ .collapse-btn i{     line-height: 22px;     margin-right: 5px;     color: #2daae1;} button[aria-expanded="true"] i:before{     content: "\f374";} .collapse-head{     box-shadow: 0px 0px 20px 10px rgba(62, 62, 101, 0.1);     margin-bottom: 1rem;} .collapse-head p{     margin-bottom: 0;     padding: 15px 20px;} .collapse-head button{     color: #3b3838;     background-color: #fff;     width: 100%;     display: inline-flex;     padding: 16px 20px;} .collapse-head button:hover{     cursor: pointer;} button[aria-expanded="true"]{     background-color: #3b3838;     color: #fff;}/**========================= END COMMON =========================**//**========================= START PAGES =========================**/ .page-not-found h1{     font-size: 200px;     margin-bottom: 40px;} .page-not-found i{     font-size: 60px;     line-height: 0;     position: relative;     top: 11px;}/* coming soon */ .coming-soon-bg{     background-image: url(../images/img-1.jpg);     background-attachment: fixed;     background-size: cover;} .coming-soon-content{     position: absolute;     margin: 0px auto;     left: 50%;     top: 50%;     transform: translate(-50%, -50%);     text-align: center;} .time-bg{     font-size: 60px;     text-align: center;     margin: 0px auto;     width: 100%;     position: relative;} #time span{     text-transform: uppercase;     text-align: center;     padding: 10px 20px;     margin: 7px;     font-family: 'Roboto', sans-serif;     font-weight: 900;     border: 5px solid #2daae1;} .coming-soon-content .btn:hover{     color: #fff;}/**========================= END PAGES =========================**//**========================= START TOP HEADER =========================**/ #top-header{     padding: 7px 0px;} .t-left-side{     float: left;} .t-right-side{     float: right;} #top-header ul{     margin: 0px;     padding: 0px;     display: inline-block;} #top-header li{     display: inline-block;     margin: 0px;     padding: 0px;} #top-header .t-left-side li{     margin-right: 25px;     position: relative;} #top-header .t-left-side li a{     color:#ffffff;} #top-header.secondary-bg .t-left-side li{     color: #fff;} #top-header .t-left-side li:after{     content: "";     position: absolute;     top: 0px;     left: -14px;     background-color: #3b3838;     width: 1px;     height: 20px;} #top-header.secondary-bg .t-left-side li:after{     background-color: #2daae1;} #top-header .t-left-side li:first-child:after{     display: none;} #top-header .t-left-side i{     color: #2daae1;     line-height: 0;     position: relative;     top: 3px;}/**========================= END TOP HEADER =========================**//**========================= START HEADER =========================**/ #header{     margin: 0px;     padding: 0px 0px;     background: #ffffff;     box-shadow: 0 0 15px 0 rgba(0,0,0,.1);     height: 96px;} .header-fixed{     position: fixed;     top: 0;     z-index: 999;     background-color: #fff;     width: 100%;     animation: 1s menuFix;     -webkit-animation: 1s menuFix;     -o-animation: 1s menuFix;     -moz-animation: 1s menuFix;} .logo{     text-align: left;} #header .navbar{     padding: 0px;} #header .navbar-brand{     font-size: 30px;} #header .navbar-brand span{     color: #2daae1;} #header .nav-item{     position: relative;} #header .nav-item i.navhome-icon{     line-height: 0px;     position: relative;     top: 3px;} #header .nav-item .btn:hover{     color: #fff;} #header .nav-link{     margin: 29px 3px;     letter-spacing: 0.3px;     font-weight: 600;     font-size: 16px;} #header .dropdown-menu{     margin: 0px;     padding: 0px;     border-radius: 0;     background-color: #fff;     font-size: 14px;     min-width: 14rem;} #header .dropdown-menu .dropdown-item{     padding: 10px 20px;     color: #3b3838;} #header .dropdown.active .dropdown-menu .dropdown-item{     border-bottom: 0;} #header .dropdown-menu .dropdown-item:hover, #header .dropdown.active .dropdown-menu .dropdown-item:hover{     background-color: #2daae1;     color: #3b3838;     border-bottom: 0px;} #header .dropdown.active .dropdown-menu a{     color: #3b3838;} #header .dropdown.active .dropdown-menu .dropdown-item.active{     background-color: #2daae1;     color: #3b3838;} .menu-btn{     margin: 22px 0px 22px 20px;} .dropdown-toggle::after {     border-top: .2em solid;     border-right: .2em solid transparent;     border-bottom: 0;     border-left: .2em solid transparent;} #header .navbar-toggler{     border-radius: 5px;     background-color: #2daae1;     outline: 0;     border: 0;     padding: 12px;} #header .navbar-toggler i{     color: #3b3838;} #header .navbar-toggler[aria-expanded="true"] i:before{     content: "\f156";}/* Multilevel Dropdown */ .dropdown-submenu{     position: relative;} .dropdown-submenu>.dropdown-menu{     top: 0;     left: auto;     right: 100%;} .dropdown-submenu:hover>.dropdown-menu{     display: block;} .dropdown-submenu>a:after{     display: block;     content: "";     float: right;     width: 0;     height: 0;     border-color: transparent;     border-style: solid;     border-width: 5px 0 5px 5px;     border-left-color: #3b3838;     margin-top: 5px;     margin-right: -10px;} #header .multi-level .dropdown-menu .dropdown-item{     padding-left: 30px;}/**========================= END HEADER =========================**//**========================= START SLIDER =========================**/ #main-slider{     background-color: #eee;     position: relative;} #main-slider .carousel-indicators{     display: none;} #main-slider .carousel-item{     background: no-repeat center center scroll;     -webkit-background-size: cover;     -moz-background-size: cover;     -o-background-size: cover;     background-size: cover;} #main-slider .carousel-item:before{     content: "";     left: 0;     right: 0;     top: 0;     bottom: 0;     position: absolute;     width: 100%;     height: 100%;     background-color: #3b3838;     opacity: 0.4;} #carouselExampleIndicators h5, #carouselExampleIndicators h3, #carouselExampleIndicators p{     color: #fff;} #carouselExampleIndicators p{     font-size: 20px;     font-weight:300;} #carouselExampleIndicators h3{     font-size: 60px;     text-shadow: rgb(119, 119, 119) 0.03em 0.03em;} #carouselExampleIndicators h5{     margin-bottom: 1.5rem;} .carousel-indicators .active{     background-color: #3b3838;} .carousel-indicators:hover{     cursor: pointer;} #carouselExampleIndicators .carousel-item{     height: 700px;     background-position: top;} #carouselExampleIndicators .carousel-caption{     width: 40%;     position: absolute;     left: 50%;     top: 46%;     transform: translate(-50%, -50%);     margin: 0px auto;} #carouselExampleIndicators .carousel-caption .container{     animation: 1s bcktop;     -webkit-animation: 1s bcktop;     -o-animation: 1s bcktop;     -moz-animation: 1s bcktop;} #carouselExampleIndicators .carousel-caption .btn{     margin: 3px;} .carousel-control-next-icon, .carousel-control-prev-icon{     padding: 20px;} #main-slider .carousel-indicators{     text-align: center;     bottom: 10%;} .carousel-indicators li{     display: inline-block;}/**========================= END SLIDER =========================**//**========================= START BREADCRUMB =========================**/ #breadcrumb{     padding: 5px 0px 25px 0px;     position: relative;     z-index: 1;     text-align: center;     background-image: linear-gradient(white, #cad0d4);     margin-top: 20px;} #breadcrumb h1{     color: #000;     font-weight: 600;} #breadcrumb ol{     margin-bottom: 0;} #breadcrumb li{     display: inline-block;     font-size: 15px;} #breadcrumb li a{     color: #2daae1;     font-size: 100%;} #breadcrumb li a:hover{     color: #000;} #breadcrumb li.active a, #breadcrumb li.active{     color: #000;}/**========================= END BREADCRUMB =========================**//**========================= START WHAT WE DO =========================**/ #packages{     padding: 80px 0px 60px;} #packages .card ul{     min-height: 400px;} #packages .card:hover, #packages .card.active{     margin-top: -10px;     border-bottom: 10px solid #2daae1;     box-shadow: 0px 0px 20px 10px rgba(62, 62, 101, 0.1);} #packages li{     line-height: 30px;} #packages ul li i{     position: relative;     top: 1px;     color: #2e9a13;} #packages .card-price-1 h2 i{     position: relative;     left: 5px;     font-size: 26px;} #packages .btn.card-price-1{     margin-bottom: 1rem;} #packages .btn.card-price-1 h2{     margin-bottom: 0;	 color:#fff;} #packages .btn.card-price-1:hover h2{     color: #2daae1;} #packages .card-price-1 h2 span{     font-size: 14px;}/**========================= END WHAT WE DO =========================**//**========================= START WHAT WE DO =========================**/ #what-we-do{     margin-top: -80px;     padding: 60px 0px 0px;} #what-we-do .card{     text-align: center;     margin-bottom: 0;} #what-we-do .card:hover, #what-we-do .card.active{     margin-top: -10px;     border-bottom: 10px solid #2daae1;     box-shadow: 0px 0px 20px 10px rgba(62, 62, 101, 0.1);} #what-we-do .card:before{     font-family: "Font Awesome 5 Pro";     font-size: 80px;     position: absolute;     left: 0px;     right: 0px;     top: 0;     margin: 0px auto;     text-align: center;     opacity: 0.1;     color: #3b3838;} #what-we-do .whatwedo-card-1:before{     content: "\f48b";} #what-we-do .whatwedo-card-2:before{     content: "\f5f3";} #what-we-do .whatwedo-card-3:before{     content: "\f12e";} #what-we-do .whatwedo-card-4:before{     content: "\f542";}/**========================= END WHAT WE DO =========================**//**========================= START WHO WE ARE =========================**/ #who-we-are{     padding: 80px 0px 75px;} #who-we-are .video-btn{     position: relative;} #who-we-are small{     font-size: 100%;} #who-we-are .pulse button{     position: absolute;     left: 50%;     right: 0px;     top: 50%;     text-align: center;     margin: 0px auto;     z-index: 9;     padding-left: 22px;     padding-right: 22px;} #who-we-are .pulse button:before{     content: "";     position: absolute;     left: 0;     right: 0;     top: 0;     bottom: 0;     border-radius: 5px;     animation: pulse_animation 2s infinite;     -webkit-animation: pulse_animation 2s infinite;     -moz-animation: pulse_animation 2s infinite;     z-index: -1;} #who-we-are .pulse button:after{     content: "";     position: absolute;     left: 0;     right: 0;     top: 0;     bottom: 0;     border-radius: 5px;     animation: pulse_animation 1s infinite;     -webkit-animation: pulse_animation 1s infinite;     -moz-animation: pulse_animation 1s infinite;     z-index: -1;} #who-we-are .modal-content{     border-radius: 5px;}/**========================= END WHO WE ARE =========================**//**========================= START COUNTER =========================**/ #counter{     padding: 80px 0px 90px;     text-align: center;} .counter-bg{     position: relative;     background-image: url(../../uploads/arkaplan/arkaplan2/slider3.jpg);     background-repeat: no-repeat;     background-size: cover;	 background-position:center;     z-index: 9;} .counter-bg:after{     content: "";     position: absolute;     left: 0;     right: 0;     top: 0;     bottom: 0;     background-color: rgba(44, 70, 79, 0.5);     z-index: -1;} #counter .counter-col{     position: relative;} #counter .counter-col:after{     content: "";     position: absolute;     right: 0px;     bottom: 0px;     top: 0px;     width: 1px;     height: 100%;     background-color: rgba(255, 255, 255, 1);} #counter .counter-col:last-child:after{     display: none;} #counter .timer{     font-weight: 900;     font-size: 2.5rem;     color: #fff;     margin-left: 10px;} #counter h4{     margin-bottom: 0;     color: #fff;} #counter .counter-img{     text-align: left;} #counter .counter-img img{     position: absolute;     left: 70px;     bottom: -90px;     width: 160px;}/**========================= END COUNTER =========================**//**========================= START PROVIDING =========================**/ #providing{     padding: 80px 0px 60px;     text-align: center;}/**========================= END PROVIDING =========================**//**========================= START PROJECTS =========================**/ #projects{     padding: 80px 0px 85px;} #projects.projects-bg{     position: relative;     background-image: url(../../uploads/arkaplan/arkaplan4/slider2.jpg);     background-repeat: no-repeat;     background-size: cover;	 background-position: center;     z-index: 9;} #projects.projects-bg:after{     content: "";     position: absolute;     left: 0;     right: 0;     top: 0;     bottom: 0;     background-color: rgba(44, 70, 79, 0.7);     z-index: -1;} #projects.projects-bg h1{     color: #fff;} #projects .slick-prev, #projects .slick-next{     right: 12px;} .project-grid{     padding: 60px 0px 60px;} .project-single{     position: absolute;     bottom: 0;     right: 0;     left: 0;     width: 50%;} .project-single li{     line-height: 36px;} .project-single i{     position: relative;     top: 2px;     right: 6px;     font-size: 20px;     line-height: 0;} .project-single i:before{     width: 10px;     height: 0px;}/* Filter */ .filters-group{     text-align: center;} .filters-group li{     display: inline-block;     background: #2daae1;     color: #fff;     margin-bottom: 5px;} .filters-group .btn-active{     background-color: #3b3838;     color: #fff;} .filter-content a{     font-size: 100%;} .isotope-item{     z-index: 2;} .isotope-hidden.isotope-item{     pointer-events: none;     z-index: 1;} .isotope, .isotope .isotope-item{     -webkit-transition-duration: 0.8s;     -moz-transition-duration: 0.8s;     transition-duration: 0.8s;} .isotope{     -webkit-transition-property: height, width;     -moz-transition-property: height, width;     transition-property: height, width;} .isotope .isotope-item{     -webkit-transition-property: -webkit-transform, opacity;     -moz-transition-property: -moz-transform, opacity;     transition-property: transform, opacity;}/* Grid */ .grid{     position: relative;     margin: 0 auto;     list-style: none;} .grid .grid-effect{     position: relative;     float: left;     overflow: hidden;     text-align: center;     background: #3b3838;     transition:all 0.4s;     -webkit-transition:all 0.4s;     -moz-transition:all 0.4s;     -o-transition:all 0.4s;} .grid .grid-effect img{     position: relative;     display: block;     object-fit: cover;     height: 350px;     -webkit-transition: all 600ms ease;     -moz-transition: all 600ms ease;     -ms-transition: all 600ms ease;     -o-transition: all 600ms ease;     transition: all 600ms ease;} .grid .grid-effect .p-grid-content{     padding: 2em;     color: #fff;     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100%;     -webkit-backface-visibility: hidden;     backface-visibility: hidden;} .grid .grid-effect .p-grid-content::before, .grid .grid-effect .p-grid-content::after{     pointer-events: none;} .grid .grid-effect .p-grid-content{     padding: 2em;} .grid .grid-effect .p-grid-content::before, .grid .grid-effect .p-grid-content::after{     position: absolute;     content: '';     opacity: 0;} .grid .grid-effect .p-grid-content::before{     top: 50px;     right: 30px;     bottom: 50px;     left: 30px;     border-top: 1px solid #fff;     border-bottom: 1px solid #fff;     -webkit-transform: scale(0,1);     transform: scale(0,1);     -webkit-transform-origin: 0 0;     transform-origin: 0 0;} .grid .grid-effect .p-grid-content::after{     top: 30px;     right: 50px;     bottom: 30px;     left: 50px;     border-right: 1px solid #fff;     border-left: 1px solid #fff;     -webkit-transform: scale(1,0);     transform: scale(1,0);     -webkit-transform-origin: 100% 0;     transform-origin: 100% 0;} .grid .grid-effect h2{     padding-top: 7%;     opacity: 0;     color: #fff;     margin-bottom: 0;} .grid .grid-effect p{     padding: 0.5em 2em;     text-transform: none;     opacity: 0;     -webkit-transform: translate3d(0,-10px,0);     transform: translate3d(0,-10px,0);} .grid .grid-effect img, .grid .grid-effect .p-grid-content::before, .grid .grid-effect .p-grid-content::after, .grid .grid-effect p {     -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;     transition: opacity 0.35s, transform 0.35s;} .grid .grid-effect:hover img{     opacity: 0.4;     -webkit-transform: translate3d(0,0,0);     transform: translate3d(0,0,0);} .grid .grid-effect:hover:after{     content: "";     position: absolute;     bottom: 0;     left: 0;     right: 0;     border-bottom: 10px solid #2daae1;} .grid .grid-effect:hover .p-grid-content::before, .grid .grid-effect:hover .p-grid-content::after{     opacity: 1;     -webkit-transform: scale(1);     transform: scale(1);} .grid .grid-effect:hover h2, .grid .grid-effect:hover p{     opacity: 1;     -webkit-transform: translate3d(0,0,0);     transform: translate3d(0,0,0);} .grid .grid-effect:hover .p-grid-content::after, .grid .grid-effect:hover h2, .grid .grid-effect:hover p, .grid .grid-effect:hover img{     -webkit-transition-delay: 0.15s;     transition-delay: 0.15s;}/**========================= END PROJECTS =========================**//**========================= START NEW PROJECT =========================**/ #new-project{     padding: 60px 0px;} #new-project.new-project-bg{     position: relative;     background-image: url(../../uploads/arkaplan/arkaplan6/critical-alerting-background.jpg);     background-repeat: no-repeat;     background-size: cover;	 background-position: center;     z-index: 9;} #new-project.new-project-bg:after{     content: "";     position: absolute;     left: 0;     right: 0;     top: 0;     bottom: 0;     background-color: rgba(44, 70, 79, 0.5);     z-index: -1;} #new-project.new-project-bg h1, #new-project.new-project-bg h2, #new-project.new-project-bg p{     color: #fff;}/**========================= END NEW PROJECT =========================**//**========================= START WORKERS =========================**/ #workers{     padding: 60px 0px 60px;} #workers .workers-img{     position: relative;     border-radius: 5px;} #workers .social-icons{     position: absolute;     bottom: 40px;     left: 0;     right: 0;     margin: 0px auto;     text-align: center;     display: none;} #workers .workers-col:hover .social-icons{     display: block;     animation: bcktop 1s forwards;     -webkit-animation: bcktop 1s forwards;     -moz-animation: bcktop 1s forwards;     -o-animation: bcktop 1s forwards;} #workers .workers-active .social-icons{     display: block;     animation: bcktop 0s forwards;     -webkit-animation: bcktop 0s forwards;     -moz-animation: bcktop 0s forwards;     -o-animation: bcktop 0s forwards;} #workers .workers-col:hover .workers-img:before, #workers .workers-active .workers-img:before{     content: "";     position: absolute;     left: 0;     right: 0;     top: 0;     bottom: 0;     background-color: #3b3838;     opacity: 0.5;} #workers .social-icons li{     display: inline-block;} #workers .card{     padding: 0px;     text-align: center;     border-top-left-radius: 0;     border-top-right-radius: 0;}/**========================= END WORKERS =========================**//**========================= START HAPPY CLIENTS =========================**/ #happy-clients{     padding: 80px 0px 90px;     text-align: center;} .happy-clients-bg{     position: relative;     background-image: url(../../uploads/arkaplan/arkaplan5/slider1.jpg);     background-repeat: no-repeat;     background-size: cover;	 background-position:center;     z-index: 9;} .happy-clients-bg:after{     content: "";     position: absolute;     left: 0;     right: 0;     top: 0;     bottom: 0;     background-color: rgba(44, 70, 79, 0.7);     z-index: -1;} #happy-clients .head-after{     color: #fff;} #happy-clients .card{     padding-right: 60px;     padding-left: 60px;     margin-bottom: 0;     min-height: 320px;} #happy-clients .card:before{     content: "\f756";     font-family: "Material Design Icons";     font-size: 150px;     position: absolute;     left: 0px;     right: 0px;     top: 0;     margin: 0px auto;     text-align: center;     opacity: 0.15;     color: #3b3838;} #happy-clients .hclients-img img{     width: auto;     position: absolute;     top: -10px;     left: -10px;     right: 0;     max-width: 80px;     background: #fff;     box-shadow: 0px 0px 20px 0px rgba(62, 62, 101, 0.13);} .star-rating{     margin-bottom: 0;} .star-rating li{     display: inline-block;}/**========================= END HAPPY CLIENTS =========================**//**========================= START BLOG =========================**/ #blog{     padding: 60px 0px 60px;} #blog img{     border-radius: 5px;     object-fit: cover;     height: 220px;     background-color: #000000;     -webkit-transition: all 600ms ease;     -moz-transition: all 600ms ease;     -ms-transition: all 600ms ease;     -o-transition: all 600ms ease;     transition: all 600ms ease;     max-width:100%;} #blog .card{     padding: 0;} #blog .blog-img{     position: relative;} #blog .blog-date{     position: absolute;     bottom: -10px;     left: 10px;} #blog .blog-content .blog-title{     font-weight: 100;     line-height: 26px;     text-transform: unset;} #blog .blog-content .blog-title a{     font-size: 100%;     font-weight:bold;     min-height: 52px;     display: block;} #blog .blog-content p{     min-height:104px;} #blog .card li{     display: inline-block;     position: relative;     margin-right: 20px;} #blog .card li+li:before{     content: "/";     position: absolute;     left: -15px;     color: rgba(0, 0, 0, 0.5);} #blog .blog-body{     padding: 30px 2px;} #blog a:hover{     color: #888;} #blog a.btn:hover{     color: #2daae1;} .blog-share li{     display: inline-block;} .side-nav-bar li{     line-height: 40px;     border-bottom: 1px solid rgba(0, 0, 0, 0.12);} .side-nav-bar li:last-child{     border-bottom: 0;} .tags li{     margin-bottom: 4px;     display: inline-block;} #blog .pagination{     margin-bottom: 0;} #blog .pagination .page-item.active, #blog .pagination .page-item.active:hover .page-link{     background-color: #2daae1;     color: #3b3838;} #blog .pagination .page-item .page-link:hover{     background-color: #3b3838;     color: #2daae1 ;} .helpline i{     position: relative;     top: 4px;}/**========================= END BLOG =========================**//**========================= START FOTO GALERİ =========================**/ #foto_galeri{     padding: 60px 0px 60px;} #foto_galeri img{     border-radius: 5px;     object-fit: cover;     height: 220px;     background-color: #000000;     -webkit-transition: all 600ms ease;     -moz-transition: all 600ms ease;     -ms-transition: all 600ms ease;     -o-transition: all 600ms ease;     transition: all 600ms ease;} #foto_galeri .card{     padding: 0;     overflow:hidden;} #foto_galeri .blog-img{     position: relative;} #foto_galeri .blog-date{     position: absolute;     bottom: -10px;     left: 10px;} #foto_galeri .blog-content .blog-title{     font-weight: 100;     line-height: 26px;     text-transform: unset;} #foto_galeri .blog-content .blog-title a{     font-size: 100%;     font-weight:bold;     display: block;} #foto_galeri .blog-content p{     min-height:104px;} #foto_galeri .card li{     display: inline-block;     position: relative;     margin-right: 20px;} #foto_galeri .card li+li:before{     content: "/";     position: absolute;     left: -15px;     color: rgba(0, 0, 0, 0.5);} #foto_galeri .blog-body{     padding: 15px 2px;} #foto_galeri a:hover{     color: #888;} #foto_galeri a.btn:hover{     color: #2daae1;} #foto_galeri a:hover img {     opacity: 0.5;} #foto_galeri .pagination{     margin-bottom: 0;} #foto_galeri .pagination .page-item.active, #foto_galeri .pagination .page-item.active:hover .page-link{     background-color: #2daae1;     color: #3b3838;} #foto_galeri .pagination .page-item .page-link:hover{     background-color: #3b3838;     color: #2daae1 ;}/**========================= END FOTO GALERİ =========================**//**========================= START FOTO =========================**/ #foto{     padding: 60px 0px 60px;} #foto img{     border-radius: 5px;     object-fit: cover;     height: 170px;     background-color: #000000;     -webkit-transition: all 600ms ease;     -moz-transition: all 600ms ease;     -ms-transition: all 600ms ease;     -o-transition: all 600ms ease;     transition: all 600ms ease;} #foto .card{     padding: 0;     overflow:hidden;} #foto .blog-img{     position: relative;} #foto .blog-date{     position: absolute;     bottom: -10px;     left: 10px;} #foto .blog-content .blog-title{     font-weight: 100;     line-height: 26px;     text-transform: unset;} #foto .blog-content .blog-title a{     font-size: 100%;     font-weight:bold;     display: block;} #foto .blog-content p{     min-height:104px;} #foto .card li{     display: inline-block;     position: relative;     margin-right: 20px;} #foto .card li+li:before{     content: "/";     position: absolute;     left: -15px;     color: rgba(0, 0, 0, 0.5);} #foto .blog-body{     padding: 15px 2px;} #foto a:hover{     color: #888;} #foto a.btn:hover{     color: #2daae1;} #foto a:hover img {     opacity: 0.5;} #foto .pagination{     margin-bottom: 0;} #foto .pagination .page-item.active, #foto .pagination .page-item.active:hover .page-link{     background-color: #2daae1;     color: #3b3838;} #foto .pagination .page-item .page-link:hover{     background-color: #3b3838;     color: #2daae1 ;}/**========================= END FOTO GALERİ =========================**//**========================= START CLIENTS =========================**/ #clients{     padding: 50px 0px;} #clients .slick-prev, #clients .slick-next{     display: none !important;}/**========================= END CLIENTS =========================**//**========================= START FOOTER =========================**/ #footer{     padding: 80px 0px 50px;} .footer-bg{     position: relative;     background-image: url(../../uploads/arkaplan/arkaplan1/img-1.jpg);     background-repeat: no-repeat;     background-size: cover;	 background-position:center;     z-index: 9;} .footer-bg:after{     content: "";     position: absolute;     left: 0;     right: 0;     top: 0;     bottom: 0;     background-color: rgba(44, 70, 79, 0.9);     z-index: -1;} #footer li{     line-height: 40px;     border-bottom: 1px solid rgba(255, 255, 255, 0.2);} #footer .social-icons li{     display: inline-block;     border-bottom: none;} #footer ul li a, #footer p a{     color: #fff;} #footer .social-icons li a{     color: #fff;} #footer h3, #footer h5, #footer p, #footer li{     color: #fff;} #footer a:hover{     color: #2daae1;}/**========================= END FOOTER =========================**//**========================= START SUB FOOTER =========================**/ #sub-footer{     padding: 30px 0px;} .sub-foot-left{     text-align: left;} .sub-foot-right{     text-align: right;} #sub-footer ul{     margin-bottom: 0 } #sub-footer li{     display: inline-block;     position: relative;     color:#fff;} #sub-footer li+li::before{     display: inline-block;     padding: 0px 5px;     content: "/";} #sub-footer a{     color: #3b3838;} #sub-footer a:hover{     color: #335763;} .backto-top-btn{     display: none;     position: fixed;     z-index: 9;     right: 2%;     bottom: 3%;     animation: bcktop 1s forwards;     -webkit-animation: bcktop 1s forwards;     -moz-animation: bcktop 1s forwards;     -o-animation: bcktop 1s forwards;     z-index: 99;     padding: 10px 12px;} .satir{     min-height:78px;} .belgeler, .referanslar{     display:flex;     justify-content:center;     align-items: center;     overflow: hidden;} .belgeler a:hover img , .referanslar a:hover img {     -webkit-transform: scale3d(1.15, 1.15, 1.15);     transform: scale3d(1.15, 1.15, 1.15);} .belgeler img{     object-fit: cover;     height: 335px;     -webkit-transition: all 600ms ease;     -moz-transition: all 600ms ease;     -ms-transition: all 600ms ease;     -o-transition: all 600ms ease;     transition: all 600ms ease;} .referanslar img{     object-fit: contain;     height: 130px;     -webkit-transition: all 600ms ease;     -moz-transition: all 600ms ease;     -ms-transition: all 600ms ease;     -o-transition: all 600ms ease;     transition: all 600ms ease;} .d-ortala-kapsa{     display:flex;     justify-content:left;     align-items: center;} .d-ortala{     text-align:center;} .custom-file {     position: relative;     display: inline-block;     width: 100%;     height: calc(3.25rem + 2px);     margin-bottom: 0;} .custom-file-input {     position: relative;     z-index: 2;     width: 100%;     height: calc(2.25rem + 2px);     margin: 0;     opacity: 0;} .custom-file-label {     position: absolute;     top: 0;     right: 0;     left: 0;     z-index: 1;     height: calc(2.65rem + 10px);     padding: 10px 25px;     line-height: 1.5;     color: #495057;     background-color: #fff;     box-shadow: 0 0 0 0 !important;     border: 2px solid rgba(44, 70, 79, 0.2);     border-radius: .25rem;} .custom-file-label::after {     position: absolute;     top: 0;     right: 0;     bottom: 0;     z-index: 3;     display: block;     height: calc(calc(3.04rem + 2px) - 1px * 2);     padding: .375rem .75rem;     line-height: 2.4;     color: #495057;     content: "Seçiniz";     background-color: #e9ecef;     border-left: 1px solid #ced4da;     border-radius: 0 .25rem .25rem 0;} .mgorus_image{     max-width:95px;     box-shadow: 0px 0px 35px 0px rgba(62, 62, 101, 0.1);} .turkey-map-drawing {     text-align: center;} .turkey-map-drawing svg {     width: 100%;     height: auto;} .turkey-map-drawing g.is-completed path {     fill: #3b3838;} .turkey-map-drawing path {     cursor: pointer;     fill: #2daae1;     -webkit-transition: .2s;     transition: .2s;} .turkey-map-drawing path:hover {     fill: #333 !important;} .turkey-map__name {     position: absolute;     z-index: 2;} .turkey-map__name div {     display: inline-block;     background: #003861;     color: #fff;     font-size: 13px;     font-weight: 500;     padding: 8px 16px;     border-radius: 2px;} .bayiler>.icon {     position: absolute;     right: 15px;     top: 15px;     display: -webkit-inline-box;     display: -ms-inline-flexbox;     display: inline-flex;     -webkit-box-align: center;     -ms-flex-align: center;     align-items: center;     -webkit-box-pack: center;     -ms-flex-pack: center;     justify-content: center;     border-radius: 100%;     width: 37px;     height: 37px;     border: 2px solid currentColor;     color: #000;     opacity: .3;} .bayiler .title {     color: #3b3838;     font-size: 20px;     font-weight: 600;     line-height: 1.3;     margin-bottom: 0;} .bayiler .title.small {     font-size: 12px;     font-weight: 400;     margin-bottom: 0px;} .bayiler .text {     display: -webkit-inline-box;     display: -ms-inline-flexbox;     display: inline-flex;     -webkit-box-align: center;     -ms-flex-align: center;     align-items: center;     color: #939393;     font-size: 13px;     margin-top: 5px;     margin-right: 10px;} a:not([href]):not([tabindex]) {     color: inherit;     text-decoration: none;} .box-footer .name {     color: #777;     font-size: 16px;     font-weight: 500;     display: block;} .box-footer .text .icon {     margin-right: 10px;     font-size: 13px;} .box-header{     margin-bottom:50px;} .iconset {     display: -webkit-inline-box;     display: -ms-inline-flexbox;     display: inline-flex;     width: 42px;     height: 42px;     -webkit-box-align: center;     -ms-flex-align: center;     align-items: center;     -webkit-box-pack: center;     -ms-flex-pack: center;     justify-content: center;     background: #000;     border-radius: 100%;     color: #fff;     font-size: 18px;     margin-bottom: 20px;     position: absolute;     left: 20px;     top: 20px;     z-index: 1;} .video-detail__wrapper {     background: #002249;     min-height: 600px;     padding-top: 50px;     padding-bottom: 150px;} .video-detail__header {     margin-top: 20px;     margin-bottom: 20px;} .video-detail__header .title {     color: #fff;     font-size: 28px;     font-weight: 400;} .video-detail-player iframe {     width: 100%;     height: 530px;} @media (max-width: 767px) {     .video-detail-player iframe {         height: auto;    }} @media (min-width: 768px) and (max-width: 991px) {     .video-detail-player iframe {         height: 400px;    }} .video-detail-other-videos .heading {     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-pack: justify;     -ms-flex-pack: justify;     justify-content: space-between;     background: rgba(0, 0, 0, 0.2);     height: 60px;     -webkit-box-align: center;     -ms-flex-align: center;     align-items: center;     padding-left: 15px;     padding-right: 15px;     color: #fff;     font-size: 16px;     font-weight: 400;} .video-detail-other-videos .heading .all-videos {     text-transform: capitalize;     font-size: 12px;     color: #fff;     opacity: .7;     font-weight: 400;} .video-detail-other-videos .heading .all-videos:hover {     text-decoration: underline;} .video-detail-list {     overflow-y: auto;     background: #0000009c;     height: calc(530px - 60px);     border-bottom: 1px solid rgba(255, 255, 255, 0.07);} @media (min-width: 768px) and (max-width: 991px) {     .video-detail-list {         height: 340px;    }} .video-detail-list li {     padding-top: 10px;     padding-bottom: 10px;     border-bottom: 1px solid rgba(255, 255, 255, 0.07);     -webkit-transition: .3s;     transition: .3s;} .video-detail-list li:last-child {     border-bottom: 0 none;} .video-detail-list li:hover {     background: rgba(0, 0, 0, 0.2);} .video-detail-list li a {     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -ms-flex-wrap: wrap;     flex-wrap: wrap;} .video-detail-list .video-left {     width: 110px;     height: 70px;     position: relative;     margin-left: 10px;     margin-right: 10px;} .video-detail-list .video-left img {     width: 100%;     height: 100%;     -o-object-fit: cover;     object-fit: cover;} .video-detail-list .video-left .icon {     position: absolute;     left: 0;     right: 0;     top: 0;     bottom: 0;     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-pack: center;     -ms-flex-pack: center;     justify-content: center;     -webkit-box-align: center;     -ms-flex-align: center;     align-items: center;     background: rgba(0, 0, 0, 0.55);     color: #fff;     font-size: 16px;} .video-detail-list .video-right {     display: -webkit-box;     display: -ms-flexbox;     display: flex;     -webkit-box-align: center;     -ms-flex-align: center;     align-items: center;     padding-left: 5px;     padding-right: 15px;} .video-detail-list .video-right .title {     color: #fff !important;     font-size: 14px !important;     font-weight: 600 !important;     line-height: 1.4 !important;     margin-bottom: 0px !important;} .haberbar img{     object-fit: cover;     height: 70px !important;     background-color: #000000;     -webkit-transition: all 600ms ease;     -moz-transition: all 600ms ease;     -ms-transition: all 600ms ease;     -o-transition: all 600ms ease;     transition: all 600ms ease;     max-width: 100%;     margin-bottom: 5px !important;     margin-top: 5px !important;} .haber-diger img{     object-fit: cover;     height: 150px !important;} .whatsapp {     position: fixed;     left: 15px;     bottom: 15px;     transition: all .5s ease-in-out;     z-index: 999;} .whatsapp a {     height: 50px;     width: 50px;     border-radius: 50%;     overflow: hidden;     box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);     font-size: 28px;     display: block;     text-align: center;     line-height: 50px;     color: white;     background: #4dc247;} .whatsapp a i{     font-size: 25px;} .whatsapp .tooltiptext {     visibility: hidden;     width: 120px;     background-color: black;     color: #fff;     text-align: center;     border-radius: 6px;     padding: 5px 0;     position: absolute;     z-index: 1;     line-height: normal;     font-size: 15px;     top: 13px;     left: 105%;     height: auto;} .whatsapp:hover a {     transform: rotate(45deg);     -webkit-transform: rotate(45deg);} .whatsapp:hover .tooltiptext {     visibility: visible;} .telefon {     position: fixed;     left: 15px;     bottom: 75px;     transition: all .5s ease-in-out;     z-index: 999;} .telefon a {     height: 50px;     width: 50px;     border-radius: 50%;     overflow: hidden;     box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);     font-size: 28px;     display: block;     text-align: center;     line-height: 50px;     color: white;     background: #337ab7;} .telefon a i{     font-size: 25px;} .telefon .tooltiptext {     visibility: hidden;     width: 120px;     background-color: black;     color: #fff;     text-align: center;     border-radius: 6px;     padding: 5px 0;     position: absolute;     z-index: 1;     line-height: normal;     font-size: 15px;     top: 13px;     left: 105%;     height: auto;} .telefon:hover a {     transform: rotate(45deg);     -webkit-transform: rotate(45deg);} .telefon:hover .tooltiptext {     visibility: visible;} .diller {     position: fixed;     left: 15px;     bottom: 135px;     transition: all .5s ease-in-out;     z-index: 999;} .diller a {     height: 50px;     width: 50px;     border-radius: 50%;     overflow: hidden;     box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);     font-size: 28px;     display: block;     text-align: center;     line-height: 50px;     color: white;     background: #000;} .diller a i{     font-size: 25px;} .diller .tooltiptext {     visibility: hidden;     width: 120px;     background-color: black;     color: #fff;     text-align: center;     border-radius: 6px;     padding: 5px 0;     position: absolute;     z-index: 1;     line-height: normal;     font-size: 15px;     top: 13px;     left: 105%;     height: auto;} .diller:hover a {     transform: rotate(45deg);     -webkit-transform: rotate(45deg);} .diller:hover .tooltiptext {     visibility: visible;} .lang {    float:left;    width:100%;} .lang img {     display: inline-block;     height: 16px;     margin-right: 8px;     margin-top: 0px;     margin-bottom: -3px;     -webkit-border-radius: 2px;     -moz-border-radius: 2px;     border-radius: 2px;} .lang .currencyitems a {    width:24%;} .activelang {    opacity:0.45;     filter:alpha(opacity=45);} .lang h4 {    float:left;    width:100%;    padding-bottom:10px;    margin-bottom:15px;     font-size: 24px;     font-weight: 600;} .lang a {     display: inline-block;     vertical-align: top;    /* width: 32%;     */     margin: 5px;     font-size: 16px;     color: #9d9d9d;     padding: 10px;     border: 1px solid #0000004d;     border-radius: 50px;} .lang a:hover {     border: 1px solid #000;     color: #000;} .ekipdetay ul {     margin-top: 35px;} .ekipdetay ul li {     display: inline-block;} .ekipdetay ul li a {     width: 40px;     height: 40px;     display: block;     line-height: 40px;     text-align: center;     border-radius: 50%;     background: #e5f6ff;     color: #69a1bb;     margin-right: 8px;     -webkit-transition: all .3s ease-out 0s;     -moz-transition: all .3s ease-out 0s;     -ms-transition: all .3s ease-out 0s;     -o-transition: all .3s ease-out 0s;     transition: all .3s ease-out 0s;} .btn.btn-with-border {     border-bottom: 1px solid #042b3d;     border-radius: 0;     min-width: auto;     padding: 0;} .iletisim .card{     min-height: 158px;} .popupform .form-column, .testimonial-section-two .form-column {     position: relative;} .popupform .form-column .inner-column, .testimonial-section-two .form-column .inner-column {     position: relative;     margin-top: -100px;     border-radius: 10px;     padding: 50px 40px 50px;     background-color: #2daae1;} .popupform .form-column h2, .testimonial-section-two .form-column h2 {     position: relative;     color: #ffffff;     font-size: 36px;     font-weight: 600;     text-align: center;     margin-bottom: 20px;} .default-form .form-group {     position: relative;     margin-bottom: 20px;} .default-form .form-group input[type="text"], .default-form .form-group input[type="email"], .default-form .form-group select {     position: relative;     display: block;     width: 100%;     line-height: 24px;     padding: 15px 25px;     color: #ffffff;     height: 50px;     font-size: 14px;     background: none;     font-weight: 400;     border-radius: 5px;     border: 1px solid #ffffff;     background: rgba(255, 255, 255, 0.10);     -webkit-transition: all 300ms ease;     -ms-transition: all 300ms ease;     -o-transition: all 300ms ease;     -moz-transition: all 300ms ease;     transition: all 300ms ease;} .default-form .form-group textarea {     position: relative;     display: block;     width: 100%;     line-height: 24px;     padding: 15px 25px;     color: #ffffff;     height: 150px;     background: rgba(255, 255, 255, 0.10);     resize: none;     font-size: 14px;     font-weight: 400;     border-radius: 5px;     border: 1px solid #ffffff;     -webkit-transition: all 300ms ease;     -ms-transition: all 300ms ease;     -o-transition: all 300ms ease;     -moz-transition: all 300ms ease;     transition: all 300ms ease;} .default-form .form-group:last-child {     margin-bottom: 0px;} .btn-style-two {     position: relative;     display: inline-block;     font-size: 16px;     line-height: 30px;     color: #ffffff;     padding: 10px 35px 10px;     font-weight: 500;     overflow: hidden;     letter-spacing: 1px;     border-radius: 50px;     background-color: #322f2f;     text-transform: capitalize;     cursor:pointer;} .btn-style-two .txt {     position: relative;     z-index: 1;     transition: all 300ms ease;     -moz-transition: all 300ms ease;     -webkit-transition: all 300ms ease;     -ms-transition: all 300ms ease;     -o-transition: all 300ms ease;} .btn-style-two:before {     content: '';     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100%;     z-index: 1;     opacity: 0;     background-color: #ab7442;     -webkit-transition: all 0.4s;     -moz-transition: all 0.4s;     -o-transition: all 0.4s;     transition: all 0.4s;     -webkit-transform: scale(1, 0.5);     transform: scale(1, 0.5);} .btn-style-two:hover::before {     opacity: 1;     transform: scale(1, 1);     -webkit-transform: scale(1, 1);} .btn-style-two:hover {     color: #ffffff;} .default-form .form-group .theme-btn:hover {     color: #222222;} .default-form .form-group .theme-btn:before {     background-color: #ffffff;}.slick-prev, .slick-next {    background-color: #2daae1 !important;} @media only screen and (max-width: 768px){     #header {         height: auto;    }}