/* font variables */ @p-font : 'dinbekregular'; @p-bold-font : 'dinbek_boldbold'; @p-condensed-font : 'dinengsbekregular'; /* color variables */ @p-text-color : #3d3d3d; @gray-text-color : #828082; @primary-color : #111111; @body-background-color : #FFFFFF; @header-border-color : #525659; @footer-background-color : #2b2d32; @footer-text-color : #807e70; @border-color : #d5d5d6; @gray : #eeeeee; @white : #FFFFFF; @black : #000000; @red : #e9070e; @green : #0e893a; @dark : #363636; /* general definitions */ a{text-decoration: none !important; color: @p-text-color; .transition(color, 0.3s); &:hover, &:active{color: @green;}} textarea{resize: none;} img:active, img:focus{outline: none; -moz-outline-style: none; outline: 0 !important;} h1, h2, h3, h4, h5, h6{margin: 0px; padding: 0px;} [role=button]{cursor:pointer;} strong{font-weight: 500;} .container{width: 1300px;} .stretch{width: 100%;} .no-padding{padding: 0px; margin: 0px;} .no-margin{margin: 0 !important;} .no-border{border: none !important;} .trans-all{transition: all .2s ease-in-out;} .display-none{display: none;} .outline-none{outline: none;} .text-red{color: @red;} .text-green{color: @green;} .text-italic{font-style: italic;} .mail-link{color: @primary-color; &:hover{color: @primary-color;}} .form-group label{font-size: 14px; color: @p-text-color; opacity: 0.6; margin-bottom: 10px;} .form-control{border-radius: 0px; border-color: @border-color;} .form-control:focus{border-color: @green; box-shadow: none;} .pointer-none{pointer-events: none;} .btn-red{background-color: @red; color: @white !important; font-size: 17px; font-weight: 400; padding: 10px 35px 5px 35px; outline: none !important;} .pointer-none{pointer-events: none;} .warning{position: absolute; padding: 5px; background-color: @red; color: @white; z-index: 10; font-size: 13px; font-weight: 700; margin-top: 2px;} .overflow-hidden{overflow-x: hidden;} .checkbox-label{font-size: 11px; padding-left: 0px !important; color: @primary-color;} .input-radio{float: left; margin-right: 8px !important; margin-top: -1px !important;} .monochrome{filter: grayscale(100%);} .non-monochrome{filter: grayscale(0%);} #scrollTop{position: fixed; bottom: 30px; right: 20px; font-size: 40px; display: none; z-index: 99; opacity: 0.8; padding: 0px 5px 2px 5px;} /*.social img{width:20px !important;}*/ .social-icons{background: #0e893a;height: 23px;float: right;padding-top: 2px;} .social-iconsHome{background: #0e893a;height: 23px;float: right;padding-top: 0px;} /* triangle corners */ .triangleRB{width: 0; height: 0; border-style: solid; border-width: 0 0 25px 25px; border-color: transparent transparent @white transparent;} .triangleRT{width: 0; height: 0; border-style: solid; border-width: 0 25px 25px 0; border-color: transparent @white transparent transparent;} .triangleLB{width: 0; height: 0; border-style: solid; border-width: 25px 0 0 25px; border-color: transparent transparent transparent @white;} .triangleLT{width: 0; height: 0; border-style: solid; border-width: 25px 25px 0 0; border-color: @white transparent transparent transparent;} /* table cell */ .display-table{display: table;} .display-table-cell{display: table-cell; vertical-align: middle; float: none;} /* functions */ .radius(@radius: 3px){ -webkit-border-radius: @radius; -moz-border-radius: @radius; border-radius: @radius; } .transition(@type, @time){ transition-property: @type; transition-duration:@time; } .rotate(@degree){ -ms-transform: rotate(@degree); -webkit-transform: rotate(@degree); transform: rotate(@degree); } .transform(@translateX, @skewX){ -moz-transform: translateX(@translateX) skewX(@skewX); -ms-transform: translateX(@translateX) skewX(@skewX); -o-transform: translateX(@translateX) skewX(@skewX); -webkit-transform: translateX(@translateX) skewX(@skewX); transform: translateX(@translateX) skewX(@skewX); } .scale(@number){ -moz-transform: scale(@number); -webkit-transform: scale(@number); transform: scale(@number); } /* styles */ body, *{font-family: @p-font; color: @p-text-color;} body{background-color: @white; header{ .carousel{ .container{width: 670px; .description{width: 290px; height: 180px; z-index: 20; position: absolute; top: 180px; padding: 40px 20px; background-color: rgba(255, 255, 255, 0.7); .seperator{width: 65px; height: 4px; background-color: @green; margin-bottom: 5px;} .text{ .title{font-family: @p-condensed-font; font-size: 28px; line-height: 30px; color: @green; margin-bottom: 10px;} .desc{font-family: @p-font; font-size: 13px; color: @green;} } .controls{position: absolute; z-index: 20; bottom: -3px; .carousel-control{background-image: none; opacity: 1; &.left{left: -4px;} &.right{left: 25px;} i.fa{background-color: @green; color: @white; font-size: 17px; font-weight: 700; padding: 1px 10px;} } } } } .item{} } .menus{background-color: rgba(255, 255, 255, 0.7); position: absolute; z-index: 10; width: 245px; height: 770px; .social{margin-top: 35px; a{margin: 0px 4px 0px 3px;} .langs{margin-left: 10px; a{background-color: @white; color: @green; font-size: 11px; padding: 6px 5px; margin: 0px; &.active, &:hover{background-color: @green; color: @white;} } } } .logo{margin-top: 50px;} .connect{margin-top: 15px; .title{font-size: 14px; margin-bottom: 20px;} .desc{font-size: 13px; line-height: 15px; margin-top: 5px; .transition(color, 0.5s);} a{ &:hover{ .desc{color: @green;} } } } .menu{margin-top: 50px; padding: 0px 43px 0px 43px; ul{ li{border-bottom: 1px solid @green; padding: 8px 0px 6px 0px; a{font-family: @p-condensed-font; font-size: 21px; color: @black; &:hover{color: @green; .transition(color, 0.5s);} } .plus{margin: 3px 3px 0px 0px;} .dropdown{position: absolute; width: 115px; left: 200px; margin-top: -30px; padding: 5px 8px 5px 8px; background-color: rgba(14, 137, 58, 0.7); display: none; li{border-color: @white; padding: 3px 0px 5px 0px; a{color: @white; font-family: @p-font; font-size: 13px; &:hover{color: @black;} } &:nth-last-child(1){border: 0px;} } } } } } .phone{margin-top: 15px; padding: 0px 43px 0px 43px; div{margin-bottom: 2px;} a{font-size: 14px; .transition(color, 0.5s); &:hover{color: @green;} } } .search{margin-top: 10px; padding: 0px 43px 0px 43px; input[type=image]{position: absolute; right: -25px; top: 10px; outline: none;} } } .menus-page{margin-top: 45px; .menu{margin-top: 19px; padding-left: 80px; ul{ li{padding: 0px 0px 0px 0px; float: left; a{font-family: @p-condensed-font; font-size: 19px; color: @black; padding: 0px 27px 0px 0px; &:hover, &.active{color: @green; .transition(color, 0.5s);} } } } } .social{margin-top: 18px; a{margin: 2px 4px 0px 3px;} .langs{margin-left: 10px; a{background-color: @white; color: @green; font-size: 11px; padding: 6px 5px; margin: 0px; &.active, &:hover{background-color: @green; color: @white;} } } } } } main{ .videos{ video{width: 100%; opacity: 0.4;} .image{position: absolute; z-index: 10; top: 0px;} } .gray-boxes{background-color: #f5f4f2; border-bottom: 0px solid @white; .boxes{margin-top: 0px; .box{width: 20%; margin: 30px 0px 30px 0px;} } } .boxes{margin-top: 40px; .box{margin: 20px 0px;/*width:205px;*/min-height:250px; .title{color: #656565; font-family: 'dinengsbekregular'; font-size: 24px; font-weight: 500;} .desc{color: #a5a5a5; font-size: 14px; font-weight: 400; line-height: 20px; margin-top: 5px; .transition(all, 0.4s);} .seperator{width: 100px; height: 1px; background-color: #4d4d4d; display: inline-block; margin: 15px 0px; .transition(all, 0.4s);} &:hover{ .title{color: @green;} .seperator{background-color: @green;} .icon img{.non-monochrome;} } .icon{ img{.monochrome;} } } } .content{ .page-title{border-left: 6px solid @green; color: @green; font-family: @p-condensed-font; font-size: 31px; margin-top: 20px; padding: 0px 0px 12px 3px;} &.page{margin-top: 50px; .image{ img{width: 100%;} } .text{padding-left: 25px; .title{font-family: @p-condensed-font; color: @dark; font-size: 32px; font-weight: bold;text-transform:uppercase; small{font-size: 20px;} } .seperator{width: 90px; height: 4px; background-color: @dark; margin-bottom: 10px;} .desc{font-size: 14px; line-height: 17px; .highlight{position: relative; font-family: @p-condensed-font; font-size: 25px; letter-spacing: 1px; line-height: 30px; margin: 15px 0px; padding: 20px 45px; background-color: @dark; color: @white; img{position: absolute; top: -10px; left: 15px;} } } } .nav-tabs{border: 0px; li{min-width: 150px; text-align: center; a{background-color: @gray; border-top: 3px solid transparent; padding: 5px 15px; font-family: @p-condensed-font; font-size: 23px; color: @black; margin-right: 5px; border-radius: 0px;} } .active{ a{border: 0px; border-top: 3px solid @green; background-color: transparent;} } } .tab-content{padding-top: 35px; font-size: 14px; line-height: 18px; label{color: @black; font-weight: bold; opacity: 1;} input[type=text], textarea{border: 0px; box-shadow: none; padding-left: 0px; border-bottom: 1px solid @green;} input[type=button]{background-color: @green; color: @white; border-radius: 0px; padding: 9px;} .warning{position: static;} .sectors .item .title{&.active{background-color: @green; color: @white;}} .history-background{position: relative; min-height: 730px; padding: 50px; &::after{position: absolute; content: ''; z-index: -1; opacity: 0.4; top: 0; left: 0; bottom: 0; right: 0;} } .new{margin-bottom: 10px; .text{padding-left: 20px; .display-table{height: 147px; .display-table-cell{vertical-align: bottom;} } } } .all-news{background-color: #c3c3c3; padding: 5px 5px; margin: 20px 0; color: @white; font-family: @p-condensed-font; font-size: 20px; .transition(all, 0.8s); &:hover{background-color: @green;} } .gallery{ img{border: 5px solid transparent; opacity: 0.75; .transition(all, 0.8s); &:hover{border-color: @green; opacity: 1;} } } } &.tab-page{margin-left: 21%;} &.corporate{margin-left: 0; .nav-tabs li{min-width: 200px; a{font-size: 26px; padding: 10px 15px;} } } } &.services{ .service{position: relative; border: 1px solid @white; border-top: 0px; cursor: pointer; .transition(all, 0.4s); img{max-width: 100%;} .text{position: absolute; bottom: 30px; text-align: center; width: 100%; color: @white; font-size: 28px; font-family: @p-bold-font; .transition(all, 0.4s);} &:hover{opacity: 0.7; .text{bottom: 40px;} } } } } } footer{margin-top: 40px; .mail-group{height: 50px; background-color: @green; input[type=text]{background-color: transparent; border: 1px solid @white; color: @white; margin-top: 8px; &::-webkit-input-placeholder{color: @white; font-size: 13px;} &::-moz-placeholder{color: @white; font-size: 13px;} &:-ms-input-placeholder{color: @white; font-size: 13px;} &:-moz-placeholder{color: @white; font-size: 13px;} } input[type=button]{position: absolute; outline: none; top: 11px; right: 3px; height: 28px; font-size: 13px; font-weight: bold; background-color: @white; color: @green; border: 0px; padding: 4px;} } .links{background-color: #e0e0e0; padding: 30px 0px 30px 0px; .title{color: @footer-text-color; font-size: 21px; font-family: @p-condensed-font;} .seperator{width: 40px; height: 5px; background-color: @green; margin: 4px 0px 6px 0px;} .ul{float: left; width: 20%; ul{ li{margin: 8px 0px; a{font-size: 13px;color: #9c9c9c; .transition(all, 0.5s); &:hover{color: @green;} } } } } .logo{ img{margin: 0px 0px 10px 0px;} .desc{color: @footer-text-color; font-size: 13px; line-height: 16px;} } .menus{border-left: 1px solid @green; border-right: 1px solid @green; padding: 0px 30px 20px 30px;} .contact{ .ul{width: 100%;} } .copyright{margin-top: 30px; color: @footer-text-color; font-size: 12px;} } } } li.deneme a {background-color:#1d1d1b !important} a.ikBack:hover {width: 550px; height: 650px;background-color: rgb(0, 0, 0); background-repeat: no-repeat; border-bottom: 0px; border-right: 5px solid rgb(255, 255, 255);} .textDeneme {background-color:#000!important;} ul#human .text {font-size:40px;} .textDetay p {color:#fff;padding-top:30px;} .ikButon {width:220px;margin:30px auto;} .ikButonTop {background-color:#ec6607;padding:15px 20px;margin-top:20px;position:relative;} .ikButonTop span {color:#fff;font-weight:600;font-size:20px;opacity:1!important;} .ikButon a {background-color:red!important;position:relative;top:0px;color:#fff;} .text1 {color:#fff!important;} .text2 {color:#fff!important;} .text3 {color:#0b4840!important;} .text4 {color:#fff!important;} .text5 {color:#162039!important;} .text6 {color:#001256!important;} .text7 {color:#fff!important;} .text8 {color:#010123!important;} .openMenu{ display:none!important; color:#fff; cursor: pointer; width:75px; text-align:center; padding:10px 20px; float:right; position:absolute; right:0px; z-index:9999; } .openMenu i {color:#0e893a;text-align:center;} header {overflow:hidden;} /*İnsan Kaynakları*/ .internshipArea {margin:30px 0px;border:2px solid #ddd;border-radius:10px;padding:10px 0px;} .iletisimBilgileri,.kisiselBilgiler,.egitimBilgileri,.yabanciDilBilgileri,.stajBilgileri,.digerBilgiler,.isDeneyimleri {height:auto;padding:10px;} .areaTitle {border-bottom:2px solid green;padding:5px 5px;} .areaTitle span {padding:5px 0px;color:green;font-weight:600;} .formArea {padding:40px 0px 0px 0px;} .internshipArea .form-control {border-radius:5px!important;font-size:13px;} .internshipArea form label {color:red;font-weight:700;color:#000;font-size:13px;} .radioLabel {font-size:12px;cursor:pointer;} span.yeniYabanciDil,{background-color:transparent;background-image:none;border:0px;color:#118040;font-size:30px;cursor:pointer;} .deneyimPlus span {background-color:transparent;background-image:none;border:0px;color:#118040;font-size:30px;cursor:pointer;} .basvuruGonder input {background-color:#5cb85c;background-image:none;color:#fff;border:0px;text-shadow:0px!important;} .basvuruGonder input:hover {background-color:#5cb85c;color:#fff;} .currentArea {padding:40px 0px;} .currentAreaTitle p {font-size:19px;font-weight:600;text-align:center;padding:10px 0px;color:#0e893a;} .currentArea .currentBox {position:relative;padding:15px 5px;min-height:650px;border:1px solid #d0c9c9;margin:10px 10px;width:615px;} .currentArea .currentBox .position {font-weight:600;} .currentArea .currentBox p {font-weight:600;color:#000;padding:10px 0px;} .styleUlDiv ul{ padding: 0px 30px; } .styleUlDiv p{ font-weight: 600; color: #000; padding: 10px 0px; } .styleUlDiv li{ list-style-type: disc; padding: 5px 10px; } ul.workDetail, ul.workText {padding:0px 30px;} ul.workDetail li {list-style-type:disc;padding:5px 10px;} ul.workText li {list-style-type:disc;padding:5px 10px;} .currentBox .workButon {position:absolute;bottom:10px;} .currentBox .workButon button {border-radius:0px;border:0px;background-image:none;background-color:#0e893a!important;color:#fff;} /*Basın tabı gizlendi*/ ul.mediaTabs li:nth-child(3) {display:none;} .offerArea {margin-top:50px;} .offerTitle h1 {color:#000;font-size:40px;font-weight:700;text-transform:uppercase;font-family: 'dinengsbekregular';} .offerFormArea {margin-top:50px;} .offerFormArea .form-group {margin-bottom:25px;} .offerFormArea input {border:0px;border-bottom:1px solid #0e893a;box-shadow:none;padding-left:0px;} .offerFormArea textarea {border:0px;border-bottom:1px solid #0e893a;box-shadow:none;padding-left:0px;} a.teklifButton {font-size:20px;background-color:#ef740b;color:#fff;padding:5px 20px;font-weight:500;position:fixed;right:40px;top:10px;z-index:90;} /*Checkbox Style*/ .control-group { display: inline-block; background: #fff; text-align: left; padding: 30px 0px; margin: 10px 0px; } .control { display: block; position: relative; padding-left: 30px; margin-bottom: 15px; cursor: pointer; font-size: 18px; font-weight:600; } .control input { position: absolute; z-index: -1; opacity: 0; } .control__indicator { position: absolute; top: 0px; left: 0; height: 20px; width: 20px; background: #e6e6e6; } .control--radio .control__indicator { border-radius: 50%; } .control:hover input ~ .control__indicator, .control input:focus ~ .control__indicator { background: #ccc; } .control input:checked ~ .control__indicator { background: #0e8839; } .control:hover input:not([disabled]):checked ~ .control__indicator, .control input:checked:focus ~ .control__indicator { background: #0e8839; } .control input:disabled ~ .control__indicator { background: #e6e6e6; opacity: 0.6; pointer-events: none; } .control__indicator:after { content: ''; position: absolute; display: none; } .control input:checked ~ .control__indicator:after { display: block; } .control--checkbox .control__indicator:after { left: 7px; top: 3px; width: 7px; height: 11px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); } .control--checkbox input:disabled ~ .control__indicator:after { border-color: #7b7b7b; } .control-group p {color:#000;font-size:20px;font-weight:600;padding:10px 0px;} .offerChange label {color:#000;font-size:17px;font-weight:600;} .offerFormArea label {color:#000;font-size:15px;font-weight:600;} .offerButton {background-color:#0e893a;border-radius:0px;padding:9px;color:#fff;} .offerButton:hover {color:#fff;} /*Checkbox Style*/ /* responsive */ @media (max-width: 1025px) { .container{width:980px;max-width:100%;position:relative;} body header .menus-page .social {margin:20px auto!important;float:left!important;position:absolute;left:0px;text-align:left!important;} body main .content.page .tab-content img {width:100%;height:auto;} .content.page.corporate .nav-tabs li {width:100%;} /*Sectors*/ body main .content.services .service .text {max-width:100%;text-align:center;} body main .content.services .service img {width:100%;height:auto;} body main .content.page .text {padding-left:0px;margin-top:10px;} /*News*/ body main .content.page .nav-tabs li {width:100%;} body main .content.page.tab-page {margin-left:0px;} body main .content.page .tab-content .new .text {padding-left:0px;} /*Kariyer*/ .aim {width:100%!important;height:100%!important;} .aim li {width:100%!important;} .aim li a {width:100%!important;height:200px!important;} /*height:200px!important; */ .aim li a img {width:100%;height:auto;} .aim a div.text {position:absolute;text-align:left;font-size:22px!important;width:150px;right:20px;bottom:70px;transform: rotate(0deg);} /*Kariyer*/ .history-background {width:100%;} .history-background img {width:100%;height:auto!important;} /*Bize Ulaşın*/ .desc img {width:100px!important;margin-top:10px;} .map-text {float:left;} body main .content.page .text .desc .highlight img {display:none;} /*Menu*/ /* .openMenu{display:block!important;position:absolute;top:0px;} .openMenu:hover {background-color:#fff;transition:background 1s;} .openMenu:hover i {color:#0e893a!important;} .menu {display:none;} .menus {display:block;max-height:380px!important;position:relative!important;width:100%!important;z-index:21!important;background-color: rgba(255, 255, 255, 1)!important;} */ .openMenu {display:block!important;position:absolute;top:10px;} .openMenu:hover {background-color:#fff;transition:background 1s;} .openMenu:hover i {color:#0e893a!important;} .menu {display:none;} .menus {width:100%!important;z-index:21!important;position:relative!important;display:block!important;height:100%!important;background-color: rgba(255, 255, 255, 1)!important;} body header .menus .social {margin-top:15px;float:left;position:relative;z-index:9998;top:10px;} body header .menus .phone {text-align:center;} /*Slider*/ body header .carousel .container .description {right:0px;top:120px;width:250px;height:150px;padding:20px 10px;} body header .carousel .container .description .controls .carousel-control.left {left:5px;} body header .carousel .container .description .controls .carousel-control.right {left:35px;} /*Videos*/ body main .videos .image img {width:100%;height:auto;} body header .menus .logo {margin-top:-20px!important;} body header .menus .menu {margin-top:5px;} body header .menus .menu ul li a {font-size:18px;} /*Detay Menu*/ body header .menus-page .detayMenu {padding-left:20px;} /* .menus-page>.detayMenu {display:none;padding:0px;} */ body header .menus-page {margin-top:10px;} .menus-page>.detayMenu li {width:100%;text-align:left;padding:10px 0px!important;border-bottom:1px solid #0e893a;} .menus-page>.detayMenu li a {padding:0px!important;font-size:18px!important;} .menus-page>.logo {text-align:center;} /*Services*/ body main .content.services .service .text {font-size:17px;} /*FooterMenu*/ .footerMenu {display:none!important;} .customSelect {display:block!important;width:100%;margin:0 auto;text-align:center;} .customSelect select {width:70%;height:40px;background:#0e893a;color:#fff;outline:0px;border:1px solid #fff;} .customSelect select option {color:#fff;} /*Footer*/ .links .logo {text-align:center;} .links .contact {text-align:center;margin-top:20px;} body footer .links .seperator {display:none;} body footer .links .copyright {text-align:center;} body main .gray-boxes .boxes .box {width:100%;} .currentArea .currentBox {min-height:auto;padding:40px 0px;border:1px solid #d0c9c9;width:100%;} .currentBox .workButon {position:relative;width:100%;top:20px;} .currentBox .workButon button {border-radius:0px;border:0px;background-image:none;background-color:#0e893a!important;color:#fff;} .offerButton {width:100%;} .teklifButton { position: fixed; right: 43px!important; top: 112px!important; } } @media (min-width: 480px) and (max-width: 1025px){ body main .boxes .box {width:100%;} } @media (min-width:1025px) { .menu {display:block!important;} .detayMenu {display:block!important;} .customSelect {display:none!important;} .footerMenu {display:block!important;} } @media (max-width:480px) { .social {} body header .menus .logo {float:left;margin-top:20px!important;text-align:center;} body header .menus-page .logo {margin-top:50px;} body header .menus .social .langs {position:relative;} .teklifButton {position:fixed;right:0px;top:100px;padding:5px 5px!important;} } @media (max-width:780px) { body header .menus-page .social .langs {position:absolute;left:100px;} body header .menus .social .langs {position:relative;} body header .menus-page .social a.pull-right {float:left!important;text-align:left!important;} .textDeneme {display:none;} .ikButon {margin:15px auto;} .ikButonTop {padding:8px 20px;margin-top:10px;} } a.togglefaqTwo { font-weight:500; background-color:#0e893a!important; font-size:16px; text-align:left; } a.togglefaqTwo:hover { color:#fff; } a.togglefaqTwo:focus { color:#fff; } .togglefaqTwo { text-decoration: none; color: #fff; font-size: 13px; padding: 10px 30px; display: block; width:100%; margin-bottom:5px; background-color:#0e893a; text-align: center; } .faqanswerTwo { display: none; background:#fff; color:#007cb1; padding: 12px 20px 12px 30px; font-size:13px; } .faqanswerTwo p span { color:#000; font-size:15px; } .docu{ text-align: right; margin-top: 50px; }