/*
Theme Name: TT
Theme URI: https://ttreklamweb.com/
Author: Fatih Sultan Pişgin
*/

/* reset */
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,footer,header,main,menu,nav,section{display:block}a{text-decoration: none;background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}img{border:0}* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}*:before,*:after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}



/* core */
html {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
body {font-family: "futura-pt", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size: 16px;line-height:1.42857;color: #333}
a {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
p {margin: 0 0 20px;}
h2 {margin: 0 20px 20px; font-size: 20px; line-height: 20px;}
section, nav, footer, #map, img {-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
@media (max-width: 768px) {h1 {line-height: 30px}}
.container {margin-right: auto;margin-left: auto;padding-left: 20px;padding-right: 20px;}
@media (min-width: 768px) {.container {width: 750px;}}
@media (min-width: 992px) {.container {width: 970px;}}
.row {margin-left: -20px; margin-right: -20px;}

#products a {color: #333}
#products strong {font-weight: normal;}





@media (max-width: 768px) {
	#menu {
	display: none;
	position: fixed;
	padding: 200px 0 50px;
	border-radius: 3px;
	background: #9e8c38;
	top: 20px;
	left: 20px;
	bottom: 20px;
	right: 20px;
	z-index: -1
}

.mobile #menu {
	display: block
}

.mobile #menu a {
	display: block;
	color: #fff;
	text-align: center;
	font-weight: 600;
	font-size: 20px;
	line-height: 20px;
	margin-bottom: 30px
}
}




/* nav */
nav {position: fixed;top:0;margin: 20px;width: calc(100vw - 40px);height: 50px;font-weight: 600;line-height: 50px;z-index: 10;background: #9e8c38}
nav .logo {float: left;margin-left: -3px;margin-top: -20px;}
nav h1 {margin: 0;padding: 0; float: left}
nav .lang img {margin-top: 12px; width: 20px; height: 20px; border: 2px solid white;-webkit-border-radius: 40px;-moz-border-radius: 40px;border-radius: 40px; box-sizing: content-box;}
nav #menu {display: none;}
nav .mobile {background: #f36f21; margin-left: -20px; margin-right: -20px;text-align: right; padding: 20px; margin-top: 70px; display: block !important;}
nav .mobile a {display: block; color: white;}
nav #en, nav #tr {float: right; margin-top: 15px}
nav #en img, nav #tr img {float: right; border: 2px solid white; border-radius: 50%;}
:lang(en-US) #en {display: none;}
:lang(tr) #tr {display: none;}
.trigger {position: relative;width: 25px;height: 18px;margin: 16px 0 16px 20px;float:right;-webkit-transition-duration: 0.5s;transition-duration: 0.5s}
.trigger .icon {-webkit-transition-duration: 0.5s;transition-duration: 0.5s;position: absolute;height: 2px;width: 25px;top: 8px;background-color: #fff;}
.trigger .icon:before {-webkit-transition-duration: 0.5s;transition-duration: 0.5s;position: absolute;width: 25px;height: 2px;content: "";top: -8px;background-color: #fff;}
.trigger .icon:after {-webkit-transition-duration: 0.5s;transition-duration: 0.5s;position: absolute;width: 25px;height: 2px;content: "";top: 8px;background-color: #fff;}
.trigger.open-the-menu .icon {-webkit-transition-duration: 0.5s;transition-duration: 0.5s;background: transparent !important}
.trigger.open-the-menu .icon:before {-webkit-transform: rotateZ(45deg) scaleX(1) translate(6.5px, 6.5px);transform: rotateZ(45deg) scaleX(1) translate(5.5px, 5.5px)}
.trigger.open-the-menu .icon:after {-webkit-transform: rotateZ(-45deg) scaleX(1) translate(6px, -6px);transform: rotateZ(-45deg) scaleX(1) translate(6px, -6px)}
.trigger:hover {cursor: pointer}
@media (min-width: 992px) {.trigger {display: none;}#menu {display: block !important;float: right;margin-left: 10px}#menu a {float: left;color: white; margin: 0 10px 0 0;font-size: 14px;}nav .active {color:rgba(255,255,255,.75) !important}}
@media (max-width: 992px) {nav #en, nav #tr {float: left}nav .logo { position: fixed; left: 50%; margin-left: -100px;}nav .logo img{width: 200px; height: auto;} #products .col, #team .col, #export .col {width: 100% !important; margin-bottom: 20px;}#contact {margin-left: 0px; margin-bottom: 20px;} #home {height: calc(50vh - 110px) !important;width: calc(100vw - 40px) !important;background: url(assets/img/menda.jpg) no-repeat center center !important;-webkit-background-size: cover !important;-moz-background-size: cover !important;-o-background-size: cover !important;background-size: cover !important;}}



/* section */
section, footer {text-align:center;margin: 20px;position: relative;padding: 70px 0 50px;background: rgba(240,240,240,1);}
section:nth-child(2n) {background: rgba(250,250,250,1);}
section h1 {font-size: 30px;line-height: 30px; margin: 0 0 30px;text-align: center}

/* col */
.col {width: calc(100%);position: relative;float: left;}

/* intro */
#home {margin: 90px 20px 20px;position: relative;height: calc(70vh - 110px);width: calc(100vw - 40px);background: url(assets/img/menda.jpg) no-repeat bottom center fixed;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}


/* about-us */
#about-us {text-align: center;}


/* team */
#team .col {width: 33.3333%;text-align: center; padding: 0;}
#team img {-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%; width: 200px; height: 200px; margin-bottom: 20px}
#team h2 span {font-weight: normal;font-size: 16px;}


/* product */
#products .col {width: 33.3333%;text-align: center; min-height:265px;padding: 0 20px;}
#products img {width: 100%; height: 200px; margin-bottom: 20px;display: block}
#products h2 {margin: 0;font-size: 14px;line-height: 14px;color: #333}
#products .fwi {height: auto}


#brands {height: calc(30vh - 30px);text-align: center;}
#brands img {margin: 0 20px}


/* works system */
#works-system dl {counter-reset: my-badass-counter;}
#works-system dl dt {display:block; margin-bottom: 40px;}
dt:before {
	content: counter(my-badass-counter);
	counter-increment: my-badass-counter;
	font-weight: bold;
	font-size: 20px;
	line-height: 40px;
	width: 40px;
	height: 40px;
	display: block;
	left: 50%;
	margin-left: -20px;
	margin-bottom: 10px;
	text-align: center;
	position: relative;
	border: 2px solid #333;
	-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;
}

#export .col {width: 25%;}
#export img {-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%; width: 100px; height: 100px; margin-bottom: 20px}
#export ul {list-style: none;padding: 0;margin: 0;font-size: 18px;}


















/* footer */
footer {height: 500px;background: url(assets/img/contact-bg.jpg) no-repeat center center;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}
footer h1 {margin: 0;font-size: 20px;}
footer p {margin: 0 0 20px;}
footer address {margin-bottom: 20px;font-style: normal;}
footer a {color: white;}
footer a:hover {text-decoration: underline}
footer .address {color:white;position:relative;width: 33.3333%;float: left;background: #9e8c38; height: 500px; padding: 70px 20px; z-index: 2;margin-top: -70px;}
footer #map {width:calc(100vw - 40px);height: 320px;z-index: 1;margin-top: -70px;position: absolute;}
footer ul {margin: 20px 0; padding: 0; list-style: none;}
footer ul li {display: inline-block;}
@media (max-width: 768px) {
	footer {margin: 20px;width: calc(100vw - 40px);padding:0;height: auto}
	footer .address {width:calc(100vw - 40px);margin: 0; height: auto; padding: 70px 30px; text-align: center; z-index: 2;}
	#map {margin: 20px 0;}
	.address {-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
}



/* core */
section:after, section:before, .row:after, .row:before {content: " ";display: table;}
section:after, .row:after {clear: both;}
@-ms-viewport {width: device-width;}