@charset "utf-8";

/* CSS Document 3*/





@font-face {

  font-family: Raleway;

  src: url('raleway-regular-webfont.woff2') format('woff2'),

       url('raleway-regular-webfont.woff') format('woff');

  font-weight: 400; font-display: swap;

}



html, body {font-family: "Raleway", sans-serif; margin: 0; height: 100%;font-size: 16px; line-height: 30px;}

* {font-family: "Raleway", sans-serif; box-sizing: border-box; }

html{scroll-behavior: smooth; /*font-size: 1em;*/}

#contact_form{text-align: left;}

#aboutus, #services > h1{text-align:left;}

.a2{text-align:center;}

.a3{text-align:center; margin: 60px 0px 60px 0px;width: 100%;clear: both;}

.clear{clear:both;}

.bosluk{width:100%; margin: auto;text-align: center;}

.header { padding: 30px; text-align: center;}

.mavi{color:#2e3191;}

.yesil{color:#089e49;}

#narrow_p{width:300px; margin: auto;}

footer{width:100%; text-align: center;height: 150px; display:table;}

.cizgi{width:85%; margin: auto;}

#contact_left{text-align: center;}

#btn{width:150px; height: 45px; }

#sbt{margin: auto; text-align: center;}

#ikinci{min-height:550px;margin: 4%; background-repeat: no-repeat; background-size: cover;color:#fff; font-size:22px; font-weight:bold; text-align: center; background-color: #2e3191;

background-image: url('images/glass_about_us.jpg');background-image: -webkit-image-set(url('images/glass_about_us.webp') 1x);}

.content {/*padding: 16px;*/}

.sticky {position: fixed; top: 0; width: 100%;}

.sticky + .content {padding-top: 60px;}

h1{font-size:2.2em; color: #089e49; }

h2 {font-size:1.17em; display:block; margin-block-start:1em; margin-block-end:1em; font-weight:bold;}

#starter {background-repeat: no-repeat; background-size: cover;background-attachment: fixed; width: 100%; min-height: 720px; margin-top: 20px; text-align:center; align-items: center; font-size:20px;background-color: #089e49;background-image: url('images/glass_main_square.jpg');background-image: -webkit-image-set(url('images/glass_main_square.webp') 1x);}

#foot1{ font-weight: 700; font-size:16px; width: 100%; margin-top:50px;}

#foot2{width: 100%; margin-top:20px;}

#power_container{height: 65px; width: 100%; display: flex;justify-content: center;}

#osher{margin-top:25px;display: table-cell; vertical-align: middle;}

.power{margin-top:40px; display:table-cell; vertical-align: middle;width: 50%;}

.power2{margin-top:40px; display:table-cell; vertical-align: middle;width:50%;}

.top-nav {display: flex;flex-direction: row; align-items: center; justify-content: space-between; background-color: #333; color: #FFF;height: 50px; padding: 1em;}

.menu {display: flex; flex-direction: row; list-style-type: none; margin: 0; padding: 0; font-size: 20px;}

.menu > li {/*margin: 0 1rem;*/ overflow: hidden;}

.menu-button-container {display: none; height: 100%; width: 30px; cursor: pointer; flex-direction: column; justify-content: center; align-items: center;}

#menu-toggle {display: none;}

.menu-button,

.menu-button::before,

.menu-button::after {display: block; background-color: #fff; position: absolute; height: 4px; width: 30px; transition: transform 400ms cubic-bezier(0.23, 1, 0.32, 1);border-radius: 2px;}

.menu-button::before {content: ''; margin-top: -8px;}

.menu-button::after {content: ''; margin-top: 8px;}

#menu-toggle:checked + .menu-button-container .menu-button::before { margin-top: 0px; transform: rotate(405deg);}

#menu-toggle:checked + .menu-button-container .menu-button {background: rgba(255, 255, 255, 0);}

#menu-toggle:checked + .menu-button-container .menu-button::after {margin-top: 0px; transform: rotate(-405deg);}



@media (min-width: 901px) {



.logo1{/*padding-top: 20px;*/ margin-top: -15px; z-index: 2;font-size: 50px; font-weight: 500;}

.logo2{ z-index: 1; display: block; position: absolute; padding-top: 5px; /*color:#7b7b7b;*/ color:#474747; font-size: 20px; margin: auto;text-align: center; width:100%;font-weight: 600;}

.sustain_left{float:left; width:50%; margin:auto;}

.sustain_right{float:left; width:50%; margin:auto;}	

#sub_servo{display: flex; flex-direction: row; justify-content: space-evenly;align-items: stretch;}

.sub_s{/*display:flex;*/ align-items: stretch;flex-wrap:nowrap;flex-direction:row; margin-left:10px;width:25%;}

.sub_s li{padding-left: 3px;}

#contact_container{display:flex; justify-content: space-evenly; margin-top: 100px;}

ol, li {list-style: decimal;padding-left: 2em;}

#header{height:110px;text-align: center;width: 100%;margin-top:20px;}

#headerm{display:none;}

.tmenu{display:none;}

#navbar {display: flex; justify-content: center; overflow: hidden;  background-color: #333;}

#navbar a {float: left; display: block; color: #f2f2f2; text-align: center; padding: 14px 16px; text-decoration: none;}

#navbar a:hover {background-color: #ddd; color: black;}

#navbar a.active {background-color: #04AA6D; color: white;}

input{width:300px; height: 30px;font-size: 1em;}

textarea{width:300px; height:110px;font-size: 1em;}

input{width:300px; height: 30px;/*font-size: 1em;*/}

textarea{width:300px; height:110px;/*font-size: 1em;*/}

#sbt{margin: auto; text-align: center;margin-top:10px;}

#products{width:100%;margin:auto; min-height:860px; padding: 10% 0 5% 0;}

#products img{width:100%; height:528px;}

.f1{object-fit:fill;}

#prd_left{float:left;width:50%; height: 100%; padding-left:20%; text-align: left;}

#prd_right{float:left; width: 50%; height: 100%; /*object-fit: inherit; object-position: 50% 50%*/}

#prd_rightm{display:none;}

.prd>li {padding: 10px; margin-left:10px;}

.b1{display:inherit; text-align: center;}

.b2{display: none;}

#services,#sustain,#contact{min-height:700px; padding: 10% 0 5% 0; width:60%; margin:auto;}

#aboutus{min-height:700px; width:60%; margin: auto;}

.metin1{width:100%; padding-top:280px; color:#fff; font-size:72px; font-weight:bold; text-shadow: 2px 2px 5px #222;}

.metin2{font-size:20px; text-shadow: 2px 2px 5px #222; line-height: 75px;}

.metin3{width:100%; padding-top:240px; color:#fff; font-size:40px; font-weight:bold; text-shadow: 2px 2px 5px #222;}

}



@media (max-width: 900px) {



.logo1{padding-top: 20px; z-index: 2;font-size: 35px; font-weight: 500;}

.logo2{ z-index: 1; display: block; position: absolute; /*padding-top: -5px;color:#7b7b7b;*/ color:#474747; font-size: 15px; margin: -5px auto 0 auto;text-align: center; width:100%;font-weight: 600; }

input{width:230px; height: 45px;/*font-size: 1em;*/}

textarea{width:230px; height:180px;/*font-size: 1em;*/}

#sbt{margin: auto; text-align: center;margin-top:10px;}

ol, li {list-style: decimal;padding-left: 1em;}	

#contact_container{display: flex; justify-content: center;  margin-top: 100px; align-content: center; flex-direction: column;  align-items: center;}

#header{display:none;}

#headerm{height:120px;text-align: center;width: 100%;}

#starter{background-repeat: no-repeat; background-size: cover; background-attachment: inherit;  min-height:700px; margin: 10px 0 0 0;background-color: #089e49; background-image: url('images/glass_main_square_m.jpg'); background-image: -webkit-image-set(url('images/glass_main_square_m.webp'));}

#navbar a {float: left; display: block; color: #f2f2f2; text-align: center; text-decoration: none;}

.tmenu{font-size:1.5em;}

.menu-button-container {display: flex;}

.menu {position: absolute; margin-top: 363px; left: 0; flex-direction: column; width: 100%; justify-content: center; align-items: center; font-size: 1.3em;}

#menu-toggle ~ .menu li {height: 0; margin: 0; padding: 0; border: 0; transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);}

#menu-toggle:checked ~ .menu li {border: 1px solid #333; height: 2.5em; padding: 0.5em; transition: height 400ms cubic-bezier(0.23, 1, 0.32, 1);}

.menu > li {display: flex; justify-content: center; margin: 0; padding: 0.5em 0; width: 100%; color: white; background-color: #222;}

.menu > li:not(:last-child) {border-bottom: 1px solid #444;}

#products{width:100%;margin:auto; margin: 60px auto 50px auto;}

#prd_left{width:85%; text-align: left;margin:auto;}

#prd_right{display:none;}

#prd_rightm{width:100%; margin: auto;text-align: center;}

.b1{display:none;}

.b2{display: inherit;text-align: center;}

#services,#sustain,#contact{min-height:700px; /*padding: 15% 0 5% 0;*/ width:85%; margin:60px auto 50px auto;}	

#aboutus{min-height:700px; width:85%; margin: auto auto 50px auto;}

.metin1{width:100%; padding-top:150px; color:#fff; font-size:65px; font-weight:bold; text-shadow: 2px 2px 5px #333; line-height: 60px;}

.metin2{font-size:25px; text-shadow: 2px 2px 5px #333; line-height: 30px;}

.metin3{width:100%; padding-top:240px; color:#fff; font-size:40px; font-weight:bold; text-shadow: 2px 2px 5px #333;}

#contact_form{text-align: center; background-color: #e4e4e4; margin-top:30px; width: 310px;}	

}