@charset "utf-8";
/*
/*	Copyright (c) 2022 Marketify
/*	Author: Marketify
/*	This file is made for CURRENT TEMPLATE


01) GRAX BASE
02) GRAX TOPBAR
03) GRAX MOBILE MENU
04) GRAX HERO
05) GRAX ABOUT
06) GRAX PORTFOLIO
07) GRAX TALK
08) GRAX NEWS
09) GRAX CONTACT
10) GRAX COPYRIGHT
11) GRAX CURSOR
12) GRAX PARTICLE EFFECT
13) GRAX GLITCH EFFECT
14) GRAX MEDIA QUERIES (FOR SMALL DEVIVES)


/*---------------------------------------------------*/
/*	01) GRAX BASE
/*---------------------------------------------------*/

html {
	overflow-x: hidden;
	padding: 0px;
	margin: 0px
}
body{
	font-family: "Mulish";
	font-size: 15px;
	line-height: 30px;
	letter-spacing: 1px;
	word-wrap: break-word;
	font-weight: 400;
	background-color: #fff;
	color: #767676;
}
svg{
	fill: currentcolor;
	width: 15px;
	height: 15px;
}
img.svg{
	width: 15px;
	height: 15px;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: #6f6f6f;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: #6f6f6f;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: #6f6f6f;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #6f6f6f;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color: #6f6f6f;
}

::placeholder { /* Most modern browsers support this now. */
   color: #6f6f6f;
}

.container{
	max-width: 1200px;
	width:100%;
	margin-left: auto;
	margin-right: auto;
	height:auto;
	padding:0px 40px;
	position:relative;
	clear:both;
}

h1, h2, h3, h4, h5, h6{
	font-weight:500;
	line-height: 1.4;
	font-family: "Poppins";
	color: #000;
}

h1 { font-size: 45px; }
h2 { font-size: 36px; }
h3 { font-size: 30px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 16px; }

.grax_tm_all_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
}
.grax_tm_all_wrap,
.grax_tm_all_wrap *{
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.grax_tm_section{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
}
#preloader {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 99999;
    display: flex;
}
#preloader:before,
#preloader:after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    height: 100%;
    z-index: -1;
    background-color: #fff;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
#preloader:after{
    left: auto;
    right: 0;
}
#preloader .loader_line{
    margin: auto;
    width: 1px;
    height: 250px;
    position: relative;
    overflow: hidden;
    -webkit-transition: all 0.8s ease 0s;
    -o-transition: all 0.8s ease 0s;
    transition: all 0.8s ease 0s;
}
.loader_line:before{
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 0%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    background-color: #000;
    -webkit-animation: lineheight 1000ms ease-in-out 0s forwards;
    -o-animation: lineheight 1000ms ease-in-out 0s forwards;
    animation: lineheight 1000ms ease-in-out 0s forwards;
}
.loader_line:after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    height: 100%;
    background-color: #C8C8C8;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-animation: lineround 1200ms linear 0s infinite;
    -o-animation: lineround 1200ms linear 0s infinite;
    animation: lineround 1200ms linear 0s infinite;
    animation-delay: 2000ms;
}

@keyframes lineheight{
    0%{
        height: 0%;
    }
    100%{
        height: 100%;
    }
}

@keyframes lineround{
    0%{
        -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    100%{
        -webkit-transform: translateY(200%);
        -ms-transform: translateY(200%);
        -o-transform: translateY(200%);
        transform: translateY(200%);
    }
}

/*hiding all*/
.preloaded .loader_line:after{
    opacity: 0;
}
.preloaded  .loader_line{
    opacity: 0;
    height: 100%!important;
}
.preloaded:before,
.preloaded:after{
    -webkit-animation: preloadedzero 300ms ease-in-out 500ms forwards;
    -o-animation: preloadedzero 300ms ease-in-out 500ms forwards;
    animation: preloadedzero 300ms ease-in-out 500ms forwards;
}
@keyframes preloadedzero{
    0%{
        width: 50%;
    }
    100%{
        width: 0%;
    }
}

/*---------------------------------------------------*/
/*	02) GRAX TOPBAR
/*---------------------------------------------------*/

.grax_tm_topbar{
	left: 0px;
	right: 0px;
	position: fixed;
	z-index: 10;
	padding: 30px 0px;
	transform: translateY(-101%);
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_topbar.opened{
	transform: translateY(0);
}
.grax_tm_topbar.animate{
	background-color: #fff;
	padding: 25px 0px;
	box-shadow: 0px 0px 10px rgba(0,0,0,.1);
}
.grax_tm_topbar .topbar_inner{
	width: 100%;
	height: auto;
	clear: both;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.grax_tm_topbar .logo .dark{display: none;}
.grax_tm_topbar.animate .logo .dark{display: block;}
.grax_tm_topbar.animate .logo .light{display: none;}
/*.grax_tm_topbar .logo img{max-width: 100px;}*/
.grax_tm_topbar .logo a{display: inline-block;}
.grax_tm_topbar .menu ul{
	/*margin: 0px;*/
	margin: -6px;
	list-style-type: none;
}
.grax_tm_topbar .menu ul li{
	margin: 0px 30px 0px 0px;
	display: inline-block;
}
.grax_tm_topbar .menu ul li:last-child{margin-right: 0px;}
.grax_tm_topbar .menu ul li a{
	text-decoration: none;
	color: #fff;
	font-family: "Poppins";
	font-weight: 500;
	transition: all .3s ease;
}
.grax_tm_topbar .menu ul li.current a{color: #401715;}
.grax_tm_topbar .menu ul li a:hover{color: #401715;}
.grax_tm_topbar.animate .menu ul li a{color: #000;}

/*---------------------------------------------------*/
/*	03) GRAX MOBILE MENU
/*---------------------------------------------------*/

.grax_tm_mobile_menu{
	width: 100%;
	height: auto;
	position: relative;
	top: 0px;
	left: 0px;
	display: none;
	z-index: 10;
}
.grax_tm_mobile_menu .topbar_inner{
	width: 100%;
	height: auto;
	float: left;
	clear: both;
	background-color: #fff;
	padding: 20px 0px;
	border-bottom: 1px solid rgba(0,0,0,.2);
}
.grax_tm_mobile_menu .topbar_in{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.my_trigger .hamburger{
    padding: 15px 15px;
    display: inline-block;
    cursor: pointer;
    transition-property: opacity, filter;
    transition-duration: 0.15s;
    transition-timing-function: linear;
    font: inherit;
    color: inherit;
    text-transform: none;
    background-color: transparent;
    border: 0;
    margin: 0;
    overflow: visible;
}
.my_trigger .hamburger-box{
    width: 30px;
    height: 18px;
    display: inline-block;
    position: relative;
}
.my_trigger .hamburger-inner{
    display: block;
    top: 50%;
    margin-top: -2px;
}
.my_trigger .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after{
    width: 30px;
    height: 2px;
    background-color: #333333;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease;
	
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	        border-radius: 4px;
}
.my_trigger .hamburger-inner::before,
.my_trigger .hamburger-inner::after{
    content: "";
    display: block;
}
.my_trigger .hamburger-inner::before{top: -8px;}
.my_trigger .hamburger-inner::after{ bottom: -10px;}
.my_trigger .hamburger--collapse-r .hamburger-inner{
    top: auto;
    bottom: 0;
    transition-duration: 0.13s;
    transition-delay: 0.13s;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.my_trigger .hamburger--collapse-r .hamburger-inner::after{
    top: -16px;
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
}
.my_trigger .hamburger--collapse-r .hamburger-inner::before{
    transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.my_trigger .hamburger--collapse-r.is-active .hamburger-inner{
    transform: translate3d(0, -10px, 0) rotate(45deg);
    transition-delay: 0.22s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
.my_trigger .hamburger--collapse-r.is-active .hamburger-inner::after{
    top: 0;
    opacity: 0;
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
}
.my_trigger .hamburger--collapse-r.is-active .hamburger-inner::before{
    top: 0;
    transform: rotate(90deg);
    transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.my_trigger .hamburger{
	padding: 0px;
	height: 100%;
	display: table-cell;
	vertical-align: middle;
}
.my_trigger .hamburger-box{display: block;}
.my_trigger .hamburger .hamburger-inner::before,
.my_trigger .hamburger .hamburger-inner::after,
.my_trigger .hamburger .hamburger-inner{
	background-color: #000;
	width: 30px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_mobile_menu .dropdown{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: #fff;
	border-bottom: 1px solid rgba(0,0,0,.2);
	display: none;
}
.grax_tm_mobile_menu .dropdown .dropdown_inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding: 25px 0px;
}
.grax_tm_mobile_menu .dropdown .dropdown_inner ul{
	margin: 0px;
	list-style-type: none;
}
.grax_tm_mobile_menu .dropdown .dropdown_inner ul li{
	margin: 0px;
	float: left;
	width: 100%;
}
.grax_tm_mobile_menu .dropdown .dropdown_inner ul li a{
	text-decoration: none;
	color: #000;
	display: inline-block;
	padding: 4px 0px;
	font-family: "Montserrat";
	font-weight: 500;
}
.grax_tm_mobile_menu .logo img
{
	    max-width: 175px;
	/*max-width: 70px;*/
}

/*---------------------------------------------------*/
/*	04) GRAX HERO
/*---------------------------------------------------*/

.grax_tm_hero{
	width: 100%;
	height: 100vh;
	clear: both;
	float: left;
	position: relative;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 25% 100%, 0 100%);
	overflow: hidden;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_hero.creative{clip-path: none;}
.grax_tm_hero.creative.shape{clip-path:none;}
.grax_tm_hero.shape{clip-path: polygon(0 0, 100% 0, 100% 83%, 25% 100%, 0 83%);}
.grax_tm_hero .bg{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
}
.grax_tm_hero .bg .image{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.grax_tm_hero .bg .overlay{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 1;
	background-color: rgba(0,0,0,.2);
}
.grax_tm_hero .content{
	width: 100%;
	height: 100%;
	float: left;
	position: relative;
	z-index: 2;
}
.grax_tm_hero .container{height: 100%;}
.grax_tm_hero .details{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
}
.grax_tm_hero .name{
	font-size: 72px;
	font-weight: 700;
	color: #fff;
	margin-bottom: 11px;
}

.grax_tm_hero .details[data-animation="toTop"] .fn_animation .character{top: 15px;}
.grax_tm_hero .details[data-animation="toTop"] .fn_animation .character.opened{top: 0px;}

.grax_tm_hero .details[data-animation="toRight"] .fn_animation .character{right: 15px;}
.grax_tm_hero .details[data-animation="toRight"] .fn_animation .character.opened{right: 0px;}

.grax_tm_hero .details[data-animation="scale"] .fn_animation .character{
	opacity: 1;
	visibility: visible;
	transform: scale(0);
}
.grax_tm_hero .details[data-animation="scale"] .fn_animation .character.opened{transform: scale(1);}

.grax_tm_hero .details[data-animation="rotate"] .fn_animation .character{transform: rotate(30deg);}
.grax_tm_hero .details[data-animation="rotate"] .fn_animation .character.opened{transform: rotate(0);}

.fn_animation{opacity: 0;}
.fn_animation.ready{opacity: 1;}
.fn_animation .character{
	display: inline-block;
	position: relative;
	opacity: 0;
	visibility: hidden;
	transform: translateZ(0);
	
	-webkit-transition: all .5s ease;
	   -moz-transition: all .5s ease;
	    -ms-transition: all .5s ease;
	     -o-transition: all .5s ease;
	        transition: all .5s ease;
}
.fn_animation .character.opened{
	opacity: 1;
	visibility: visible;
}
.fn_animation.job .character{
	-webkit-transition: all .4s ease;
	   -moz-transition: all .4s ease;
	    -ms-transition: all .4s ease;
	     -o-transition: all .4s ease;
	        transition: all .4s ease;
}
.grax_tm_hero .job{
	color: #ddd;
	letter-spacing: 1.5px;
	font-family: "Poppins";
	font-size: 17px;
	font-weight: 500;
	margin-bottom: 40px;
	max-width: 400px;
	font-style: italic;
}
.grax_tm_down{
	position: absolute;
	z-index: 7;
	bottom: 5%;
	display: none;
}
.grax_tm_down.opened{display: block;}
.grax_tm_down[data-position="left"]{left: 0px;}
.grax_tm_down[data-position="right"]{right: 0px;}
.grax_tm_down[data-position="center"]{
	left:50%;
	transform: translateX(-50%);
}
.grax_tm_down .line_wrapper{
	position: absolute;
    width: 1px;
    height: 100%;
    left: 0;
    right: 0;
   	margin: 0px auto;
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible;
	
    -webkit-transition: all .7s;
    -moz-transition: all .7s;
    -ms-transition: all .7s;
    -o-transition: all .7s;
    transition: all .7s;
}
.grax_tm_down .line_wrapper{
    width: 1px;
    height: 50px;
    background: none;
	display: block;
}
.grax_tm_down .line_wrapper:before{
	content: "";
	background-color: #000;
	width: 1px;
    height: 50%;
    display: block;
    top: 0;
	
    -webkit-animation: scroll-down 2s ease-in-out infinite;
    -ms-animation: scroll-down 2s ease-in-out infinite;
    animation: scroll-down 2s ease-in-out infinite;;
}

@-webkit-keyframes scroll-down {
  0% {
    height: 0;
  }
  50% {
    height: 100%;
  }
  70% {
    height: 100%;
    transform: scaleY(0.5);
    transform-origin: bottom;
  }
  100% {
    height: 100%;
    transform: scaleY(0);
    transform-origin: bottom;
  }
}
.grax_tm_down[data-skin="light"] .line_wrapper:before{background-color: #fff;}

/*---------------------------------------------------*/
/*	05) GRAX ABOUT
/*---------------------------------------------------*/

.grax_tm_about{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: #fff;
	margin-bottom: 150px;
	padding-top: 150px;
}
.grax_tm_about .about_inner{
	width: 100%;
	height: auto;
	clear: both;
	display: flex;
	align-items: center;
}
.grax_tm_about .left{
	width: 40%;
	padding-right: 50px;
}
.grax_tm_about .left .image{position: relative;}
.grax_tm_about .left .image img{
	opacity: 0;
	min-width: 100%;
}
.grax_tm_about .left .main{
	position: absolute !important;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	border-radius: 5px;
	box-shadow: 0px 0px 40px rgb(0 0 0 / 20%);
}
.grax_tm_about .right{
	width: 60%;
	padding-left: 50px;
}
.grax_tm_about .right .text{
	width: 100%;
	float: left;
	padding-top: 27px;
	padding-bottom: 28px;
}
.grax_tm_about .right .list{
	width: 100%;
	float: left;
	margin-bottom: 27px;
}
.grax_tm_about .right .list ul{
	margin: 0px 0px 0px -20px;
	list-style-type: none;
}
.grax_tm_about .right .list ul li{
	margin: 0px 0px 13px 0px;
	float: left;
	width: 50%;
	position: relative;
	padding-left: 20px;
}
.grax_tm_about .right .list ul li .list_inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	padding-left: 30px;
}
.grax_tm_about .right .list ul li span{
	font-family: "Poppins";
	font-weight: 600;
	color: #000;
	font-style: italic;
}
.grax_tm_about .right .list ul li .svg{
	width: 15px;
	height: 15px;
	position: absolute;
	left: 0px;
	top: 50%;
	transform: translateY(-50%);
	color: #000;
	margin-top: -1px;
}
.grax_tm_button{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
}
.grax_tm_button a{
	text-decoration: none;
    color: #fff;
    display: inline-block;
    background-color: #401715;
	border: 2px solid #401715;
    padding: 10px 40px;
    border-radius: 5px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_button a:hover{
	background-color: transparent !important;
	color: #000;
}
.grax_tm_progress_part{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding: 135px 0px 140px 0px;
}
.grax_tm_progress_part .part_inner{
	width: 100%;
	height: auto;
	clear: both;
	display: flex;
}
.grax_tm_progress_part .left{
	width: 100%;
	/*width: 50%;*/
	padding-right: 50px;
}
.grax_tm_progress_part .left h3{
	font-weight: 600;
	margin-bottom: 27px;
}
.grax_tm_progress_part .right{
	width: 50%;
	padding-left: 50px;
}
.kioto_progress{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
}
.progress_inner{
	width:100%;
	margin-bottom:27px;
}
.progress_inner:last-child{margin-bottom: 0px;}
.progress_inner > span{
	margin:0px 0px 7px 0px;
	width:100%;
	display:block;
	text-align:left;
	font-family: "Poppins";
	font-weight: 500;
	color: #000;
}
.progress_inner span.number{float: right;}
.progress_inner .background{
	background:rgba(0,0,0,.09);
	width:100%;
	min-width:100%;
	position:relative;
	height:8px;
	border-radius: 5px;
}
.progress_inner .background .bar_in{
	height:100%;
	background:#401715;
	width:0px;
	overflow:hidden;
	border-radius: 5px;
}
.progress_inner .background .bar{
	width:0px;
	height:100%;
}
.progress_inner .background .bar.open{
	-webkit-animation: wow 2s cubic-bezier(0.165, 0.840, 0.440, 1.000);  /* Safari 4+ */
	-moz-animation:    wow 2s cubic-bezier(0.165, 0.840, 0.440, 1.000);  /* Fx 5+ */
	animation:         wow 2s cubic-bezier(0.165, 0.840, 0.440, 1.000);  /* IE 10+ */
	width:100%;	
}

/* Online Alışveriş Css
.online-text{
	
	font-weight: 900 !important;
    text-shadow: rgba(0, 0, 0, 0.867) 1px 1px 1px;
    color: rgb(222, 131, 42) !important;
}
*/

@-webkit-keyframes wow {0%{ width:0%; } 100%{ width:100%; }}
@-moz-keyframes wow {0%{ width:0%; } 100%{ width:100%; }}
@keyframes wow {0%{ width:0%; } 100%{ width:100%; }}

/*---------------------------------------------------*/
/*	06) GRAX PORTFOLIO
/*---------------------------------------------------*/

.grax_tm_title_holder{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
}
.grax_tm_title_holder span{color: #401715;	}
.grax_tm_title_holder h3{
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 10px;
	
}
.grax_tm_portfolio{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding: 140px 0px 100px 0px;
	background-color: #f9f9f9;
}
.grax_tm_portfolio .portfolio_list{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding-top: 90px;
}
.grax_tm_portfolio ul{
	margin: 0px 0px 0px -50px;
	list-style-type: none;
}
.grax_tm_portfolio ul li{
	margin: 0px 0px 50px 0px;
	float: left;
	width: 25%;
	/*width: 33.333%;*/
	padding-left: 50px;
}
.grax_tm_portfolio ul li .list_inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	border-radius: 5px;
	overflow: hidden;
}
.grax_tm_portfolio .image{position: relative;}
.grax_tm_portfolio .image img{
	min-width: 100%;
	opacity: 0;
}
.grax_tm_portfolio .image .main{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	border-radius: 5px;
}
.grax_tm_portfolio .overlay{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 1;
	background-color: #f9f9f9;
	border-radius: 5px;
	
	opacity: 0;
	visibility: hidden;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_portfolio ul li .list_inner:hover .overlay{
	opacity: 1;
	visibility: visible;
}
.grax_tm_portfolio .details{
	position: absolute;
	bottom: 20px;
	left: 30px;
	z-index: 2;
	
	opacity: 0;
	visibility: hidden;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_portfolio ul li .list_inner:hover .details{
	opacity: 1;
	visibility: visible;
	bottom: 30px;
}
.grax_tm_portfolio .details span{font-family: "Poppins";}
.grax_tm_portfolio .details h3{
	font-size: 18px;
	font-weight: 600;
}
.grax_tm_full_link{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 4;
}
.overlay_effect{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 3;
	border-radius: 5px;
}
.overlay_effect:after{
	position: absolute;
	content: "";
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-color: #f9f9f9;
	z-index: 1;
}
.overlay_effect:before{
	position: absolute;
	content: "";
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
}
.my_waypoint.load .overlay_effect:before{
	z-index: 2;
  	background-color: #000;
  	animation: anim 2s cubic-bezier(0.77, 0, 0.175, 1) both;
}
.my_waypoint.load .overlay_effect:after{
 	animation: anim2 2s cubic-bezier(0.77, 0, 0.175, 1) both;
}

@keyframes anim{
  0% {
    transform: translateX(-100%);
  }
  50% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}

@keyframes anim2{
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}

/*---------------------------------------------------*/
/*	07) GRAX TALK
/*---------------------------------------------------*/

.grax_tm_talk{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	/*padding: 102px 20px 105px 20px;*/
	padding: 50px 20px 50px 20px;
	position: relative;
}
.grax_tm_talk:before{
	position: absolute;
    content: "";
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;  
    background-image: url(..//img/patterns/inspiration-geometry.png);
    background-repeat: repeat;
    opacity: 1; /**  If you choose lighter pattern image as background please Decrease opacity  **/
    z-index: 2;
}
.grax_tm_talk:after{
	position: absolute;
    content: "";
    top: 0px;
   	bottom: 0px;
   	left: 0px;
   	right: 0px;
   	background-color: #000;
   	z-index: 1;
}
.grax_tm_talk .talk_inner{
	width: 100%;
	height: auto;
	clear: both;
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: relative;
	z-index: 3;
}
.grax_tm_talk .text{padding-right: 20px;}
.grax_tm_talk .text h3{
	font-weight: 600;
	color: #fff;
}
.grax_tm_talk .text h3 span{position: relative;}
.grax_tm_talk .text h3 span:before{
	position: absolute;
	content: "";
	width: 20px;
	height: 4px;
	background-color: #fff;
	bottom: 11px;
	left: 100%;
	opacity: 1;
	animation: myAnim 0.9s infinite;
    -moz-animation: myAnim 0.9s infinite;
	-webkit-animation: myAnim 0.9s infinite;
}
@keyframes myAnim{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes myAnim{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-moz-keyframes myAnim{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
.grax_tm_talk .text p{
	font-family: "Poppins";
}

.grax_tm_talk .button a{
	color: #fff;
	text-decoration: none;
	font-family: "Poppins";
	font-weight: 600;
	position: relative;
	display: inline-block;
}

.grax_tm_talk .button a:before{
	content: '';
    width: 100%;
    height: 2px;
    position: absolute;
    left: auto;
    right: 0;
    bottom: 0;
    background: rgba(255,255,255,.2);
}
.grax_tm_talk .button a:after{
	content: '';
    width: 0;
    height: 1px;
    position: absolute;
    left: auto;
    right: 0;
    bottom: 0;
    transition: width .6s cubic-bezier(.25,.8,.25,1) 0s;
    background: currentColor;
}
.grax_tm_talk .button a:hover:after{
	width:100%;
	left:0;
	right:auto;
}

/*---------------------------------------------------*/
/*	08) GRAX NEWS
/*---------------------------------------------------*/

.grax_tm_news{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: #f9f9f9;
	padding: 140px 0px 90px 0px;
}
.grax_tm_news .news_list{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding-top: 90px;
}
.grax_tm_news .news_list ul{
	margin: 0px 0px 0px -50px;
	list-style-type: none;
	display: flex;
	flex-wrap: wrap;
}
.grax_tm_news .news_list ul li{
	margin: 0px 0px 50px 0px;
	float: left;
	width: 33.3333%;
	padding-left: 50px;
}
.grax_tm_news .news_list ul li .list_inner{
	width: 100%;
	height: 100%;
	clear: both;
	float: left;
	position: relative;
}
.grax_tm_news .news_list ul li .image{
	position: relative;
	overflow: hidden;
}
.grax_tm_news .news_list ul li .image img{
	min-width: 100%;
	opacity: 0;
}
.grax_tm_news .news_list ul li .image .main{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position:center; 
	transform: scale(1) translateZ(0);
	border-radius: 5px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_news .news_list ul li .list_inner .image:hover .main{transform: scale(1.1) rotate(3deg);}
.grax_tm_news .news_list ul li .details{
	width: 100%;
	float: left;
	padding-right: 15px;
	padding-top: 32px;
}
.grax_tm_news .news_list ul li .details .title{margin-bottom: 10px;}
.grax_tm_news .news_list ul li .details .title a{
	text-decoration: none;
	color: #000;
	font-size: 18px;
	font-weight: 600;
	display: inline-block;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_news .news_list ul li .details .title a:hover{color: #401715;}
.grax_tm_news .news_list ul li .details .date{
	text-transform: uppercase;
	font-family: "Poppins";
	font-size: 12px;
	color: #767676;
	font-style: italic;
}
.grax_tm_news .news_list ul li .details .date a{
	text-decoration: none;
	color: #767676;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_news .news_list ul li .details .date a:hover{color: #401715;}
.grax_tm_news .news_list ul li .details .date span{
	position: relative;
	margin-left: 11px;
}
.grax_tm_news .news_list ul li .details .date span:before{
	position: absolute;
	content: "";
	margin-top: 1px;
	top: 50%;
	transform: translateY(-50%) rotate(15deg);
	right: 100%;
	background-color: #939393;
	width: 1px;
	height: 9px;
	margin-right: 7px;
}
.grax_tm_news .description{
	opacity: 0;
	visibility: hidden;
	position: absolute;
	z-index: -11;
	display: none;
}
/* YENİ EKLENDİ*/

.grax_tm_news .news_list ul li .list_inner .image{
	position: relative;
	overflow: hidden;
	cursor: pointer;
	border-radius: 12px;
}

.grax_tm_news .news_list ul li .list_inner .image .main{
	transition: transform .4s ease;
}

.grax_tm_news .news_list ul li .list_inner .image:hover .main{
	transform: scale(1.05);
}

.grax_tm_news .news_list ul li .list_inner .image::before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to top, rgba(0,0,0,0.35), rgba(0,0,0,0.15));
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease;
	z-index: 2;
}

.grax_tm_news .news_list ul li .list_inner .image::after{
	content: "Tıklayınız";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(0.9);
	padding: 12px 24px;
	background: rgba(255,255,255,0.18);
	border: 1px solid rgba(255,255,255,0.35);
	border-radius: 999px;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.5px;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	box-shadow: 0 8px 25px rgba(0,0,0,0.20);
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease;
	z-index: 3;
	pointer-events: none;
	white-space: nowrap;
}

.grax_tm_news .news_list ul li .list_inner .image:hover::before{
	opacity: 1;
	visibility: visible;
}

.grax_tm_news .news_list ul li .list_inner .image:hover::after{
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, -50%) scale(1);
}

.grax_tm_news .news_list ul li .list_inner .image .grax_tm_full_link{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 4;
}

/* YENİ EKLENDİ BİTİŞ*/

body.modal{
	overflow-y: hidden;
}
.grax_tm_modalbox_news{
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	height: 100vh;
	z-index: 15;
	background-color: rgba(0,0,0,.8);
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease;
}
.grax_tm_modalbox_news.opened{
	opacity: 1;
	visibility: visible;
}
.grax_tm_modalbox_news .container{
	height: 100vh;
}
.grax_tm_modalbox_news .box_inner{
	position: absolute;
	top: 70px;
	bottom: 70px;
	width: 1200px;
	left: 50%;
	transform: translateX(-50%);
	background-color: #fff;
	z-index: 1;
	opacity: 0;
	visibility: hidden;
	margin-top: -20px;
	transition: all .3s ease;
	transition-delay: .3s;
}
.grax_tm_modalbox_news.opened .box_inner{
	opacity: 1;
	visibility: visible;
	margin-top: 0px;
}
.grax_tm_modalbox_news .close{
	position: fixed;
	left: 100%;
	top: 0px;
	margin-left: 40px;
	z-index: 111111;
}
.grax_tm_modalbox_news .close a{
	text-decoration: none;
	color: #fff;
}
.grax_tm_modalbox_news .close .svg{
	width: 50px;
	height: 50px;
}
.grax_tm_modalbox_news .description_wrap{
	position: relative;
	width: 100%;
	height: 100%;
	float: left;
	overflow: hidden;
	padding: 50px;
}
.grax_tm_modalbox_news .details{
	width: 100%;
	float: left;
	margin-bottom: 30px;
}
.grax_tm_modalbox_news .description{
	width: 100%;
	float: left;
}
.grax_tm_modalbox_news .description p{
	margin-bottom: 15px;
}
.grax_tm_modalbox_news .description blockquote{
	font-style: italic;
	color: #000;
	border-left: 2px solid #401715;
	padding-left: 20px;
	margin-bottom: 15px;
}
.grax_tm_modalbox_news .description_wrap .image{
	position: relative;
	max-height: 450px;
	z-index: -1;
	margin-bottom: 40px;
}
.grax_tm_modalbox_news .description_wrap .image img{
	min-width: 100%;
}
.grax_tm_modalbox_news .description_wrap .image .main{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	border-radius: 5px;
}
.grax_tm_modalbox_news .details .title{
	font-weight: 600;
	margin-bottom: 5px;
}
.grax_tm_modalbox_news .date{
	text-transform: uppercase;
    font-family: "Poppins";
    font-size: 12px;
    color: #767676;
    font-style: italic;
}
.grax_tm_modalbox_news .date a{
	text-decoration: none;
    color: #767676;
	
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}
.grax_tm_modalbox_news .date a:hover{color: #401715;}
.grax_tm_modalbox_news .date span{
	position: relative;
    margin-left: 11px;
}
.grax_tm_modalbox_news .date span:before{
	position: absolute;
    content: "";
    margin-top: 0px;
    top: 50%;
    transform: translateY(-50%) rotate(15deg);
    right: 100%;
    background-color: #939393;
    width: 1px;
    height: 9px;
    margin-right: 7px;
}
.grax_tm_modalbox_news .share{
	width: 100%;
	height: auto;
	clear: both;
	display: flex;
	align-items: center;
}
.grax_tm_modalbox_news .share span{
	font-family: "Poppins";
	color: #000;
	font-weight: 600;
	display: inline-block;
	padding-right: 20px;
}
.grax_tm_modalbox_news .share ul{
	margin: 0px;
	list-style-type: none;
}

.grax_tm_modalbox_news .share ul li{
	margin: 0px 10px 0px 0px;
	display: inline-block;
}
.grax_tm_modalbox_news .share ul li a{
	text-decoration: none;
	color: #000;
}













/*---------------------------------------------------*/
/*	09) GRAX CONTACT
/*---------------------------------------------------*/

.grax_tm_contact{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	margin-bottom: 110px;
	padding-top: 140px;
}
.grax_tm_contact .contact_inner{
	width: 100%;
	height: auto;
	clear: both;
	display: flex;
	padding-top: 77px;
}
.grax_tm_contact .left{
	/*width: 50%;*/
}
.grax_tm_contact .left .text{
	width: 100%;
	float: left;
	margin-bottom: 40px;
}
.grax_tm_contact .info_list{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
}
.grax_tm_contact .info_list ul{
	margin: 0px;
	list-style-type: none;
}
.grax_tm_contact .info_list li{
	margin: 0px 0px 18px 0px;
	float: left;
	width: 100%;
	position: relative;
}
.grax_tm_contact .info_list ul li .list_inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	padding-left: 27px;
}
.grax_tm_contact .info_list ul li span.first{
	min-width: 100px;
	display: inline-block;
}
.grax_tm_contact .info_list ul li span.second{
	font-weight: 400 !important;
	color: inherit !important;
}
.grax_tm_contact .info_list ul li span{
	font-family: "Poppins";
	font-weight: 600;
	color: #000;
}
.grax_tm_contact .info_list ul li a{
	text-decoration: none;
	color: inherit !important;
	transition: all .3s ease;
	display: inline-block;
	position: relative;
}
.grax_tm_contact .info_list ul li a:hover{color: #000;}
.grax_tm_contact .info_list ul li a:after{
	content: '';
    width: 0;
    height: 1px;
    position: absolute;
    left: auto;
    right: 0;
    bottom: 0;
    transition: width .6s cubic-bezier(.25,.8,.25,1) 0s;
    background: currentColor;
}
.grax_tm_contact .info_list ul li a:hover:after{
	width:100%;
	left:0;
	right:auto;
}
.grax_tm_contact .info_list ul li a:hover{color: #000 !important;}
.grax_tm_contact .info_list ul li .svg{
	width: 15px;
	height: 15px;
	position: absolute;
	left: 0px;
	top: 50%;
	transform: translateY(-50%);
	color: #000;
	margin-top: -1px;
}
.grax_tm_contact .right{
	width: 50%;
	padding-left: 50px;
}
.grax_tm_contact .fields{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
}
.grax_tm_contact .fields .first{
	width: 100%;
	float: left;
}
.grax_tm_contact .fields ul{
	margin: 0px;
	list-style-type: none;
}
.grax_tm_contact .fields ul li{
	width: 100%;
	margin: 0px 0px 30px 0px;
	float: left;
}
.grax_tm_contact .fields ul li input{
	width: 100%;
	border: 1px solid rgba(0,0,0,.2);
	background-color: #fff;
	border-radius: 5px;
}
.grax_tm_contact .fields ul li input:focus{
	outline: none;
	border: 1px solid rgba(0,0,0,.5);
}
.grax_tm_contact .fields .last textarea{
	width: 100%;
	border: 1px solid rgba(0,0,0,.2);
	height: 120px;
	resize: none;
	margin-bottom: 20px;
	background-color: #fff;
	border-radius: 5px;
}
.grax_tm_contact .fields .last textarea:focus{
	outline: none;
	border: 1px solid rgba(0,0,0,.5);
} 
.grax_tm_contact .empty_notice{
	color: #F52225;
	margin-bottom: 7px;
	display: none;
	text-align: left;
	font-weight: 500;
}
.grax_tm_contact .contact_error{
	color: #F52225;
	text-align: left;
	font-weight: 500;
}
.grax_tm_contact .returnmessage{
	color:#3A00FF;
	margin-bottom: 7px;
	text-align: left;
	font-weight: 500;
}
.grax_tm_contact .grax_tm_button a{
	display: block;
	text-align: center;
}

/*---------------------------------------------------*/
/*	10) GRAX COPYRIGHT
/*---------------------------------------------------*/

.grax_tm_copyright{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: #000;
	padding: 130px 0px 100px 0px;
	position: relative;
}
.grax_tm_copyright .copyright_inner{
	width: 100%;
	height: auto;
	clear: both;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.grax_tm_copyright .logo img{/*max-width: 100px;*/}
.grax_tm_copyright .social ul{
	margin: 0px;
	list-style-type: none;
}
.grax_tm_copyright .social ul li{
	margin: 0px 25px 0px 0px;
	display: inline-block;
}
.grax_tm_copyright .social ul li:last{margin-right: 0px;}
.grax_tm_copyright .social ul li a{
	text-decoration: none;
	color: #fff;
}
.grax_tm_copyright .social .svg{
	width: 17px;
	height: 17px;
}
.grax_tm_copyright .copy p{
	text-transform: uppercase;
	color: #fff;
	font-family: "Poppins";
	font-weight: 500;
	font-size: 14px;
}
.grax_tm_copyright .copy a{
	text-decoration: none;
	color: #fff;
}
.my_wave{
	position: absolute;
	top: 0;
	left: 0px;
	width: 100%;
}
.my_wave svg{
	overflow: hidden;
	vertical-align: middle;
  	height: 180px;
	width: 100%;
	fill: #fff;
}

/* YENİ EKLENDİ FOOTER*/

.minimal_footer{
	position: relative;
	background: #050505;
	padding: 120px 0 60px;
	overflow: hidden;
}

.minimal_footer .my_wave{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 120px;
	line-height: 0;
	z-index: 1;
}

.minimal_footer .container{
	position: relative;
	z-index: 2;
}

.minimal_footer .copyright_inner{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}

.minimal_footer .copy{
	max-width: 900px;
	margin: 0 auto;
}

.minimal_footer .footer_company{
	margin: 0 0 18px 0;
	color: #ffffff;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.3;
}

.minimal_footer .footer_address{
	margin: 0 auto 20px auto;
	max-width: 850px;
	color: rgba(255,255,255,0.72);
	font-size: 16px;
	line-height: 1.8;
}

.minimal_footer .footer_contact{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
}

.minimal_footer .footer_contact a{
	color: #ffffff;
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	transition: all .3s ease;
}

.minimal_footer .footer_contact a:hover{
	color: #c7c7c7;
}

.minimal_footer .footer_contact .dot{
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: rgba(255,255,255,0.35);
	display: inline-block;
}

@media (max-width: 768px){
	.minimal_footer{
		padding: 100px 0 50px;
	}

	.minimal_footer .footer_company{
		font-size: 24px;
	}

	.minimal_footer .footer_address{
		font-size: 14px;
		line-height: 1.7;
		padding: 0 10px;
	}

	.minimal_footer .footer_contact{
		flex-direction: column;
		gap: 10px;
	}

	.minimal_footer .footer_contact .dot{
		display: none;
	}
}

/* YENİ EKLENDİ FOOTER BİTİŞ*/

/* WHATSAPP ICON */

.whatsapp_float{
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 9999;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(180deg, #2ee671 0%, #22c55e 100%);
	border: 3px solid rgba(255,255,255,0.92);
	box-shadow:
		0 10px 24px rgba(0,0,0,0.22),
		0 4px 10px rgba(37,211,102,0.22);
	text-decoration: none;
	transition: transform .25s ease, box-shadow .25s ease;
}

.whatsapp_float svg{
	width: 27px;
	height: 27px;
	fill: #ffffff;
	display: block;
}

.whatsapp_float:hover{
	transform: translateY(-3px);
	box-shadow:
		0 14px 30px rgba(0,0,0,0.26),
		0 6px 14px rgba(37,211,102,0.28);
}

.whatsapp_float:focus{
	outline: none;
	box-shadow:
		0 0 0 4px rgba(37,211,102,0.18),
		0 10px 24px rgba(0,0,0,0.22);
}

@media (max-width: 768px){
	.whatsapp_float{
		width: 54px;
		height: 54px;
		right: 16px;
		bottom: 16px;
	}

	.whatsapp_float svg{
		width: 25px;
		height: 25px;
	}
}

/* WHATSAPP BİTİŞ*/

/* LANGUAGE DROPDOWN START */

.language_dropdown {
	position: relative;
	display: inline-flex;
	align-items: center;
	margin-left: 22px;
	z-index: 9999;
	font-family: inherit;
}

.language_dropdown button {
	font-family: inherit;
	cursor: pointer;
	border: none;
	outline: none;
}

.language_current {
	min-width: 52px;
	height: 34px;
	padding: 0 14px;
	border-radius: 20px;
	background: rgba(255,255,255,0.18);
	border: 1px solid rgba(255,255,255,0.55) !important;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .5px;
}

.language_current::after {
	content: "▾";
	font-size: 10px;
	margin-left: 6px;
}

.language_options {
	position: absolute;
	top: 42px;
	right: 0;
	min-width: 92px;
	padding: 6px;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(0,0,0,0.18);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: all .25s ease;
}

.language_dropdown.open .language_options {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.language_options button {
	display: block;
	width: 100%;
	height: 34px;
	margin: 0;
	padding: 0 12px;
	border-radius: 8px;
	background: transparent;
	color: #222;
	font-size: 12px;
	font-weight: 700;
	text-align: left;
}

.language_options button:hover,
.language_options button.active {
	background: #f1f1f1;
	color: #000;
}

/* Mobil görünüm */
.mobile_language_dropdown {
	display: none;
	margin-left: 0;
	margin-top: 18px;
}

.mobile_language_dropdown .language_current {
	color: #111;
	border-color: #ddd !important;
	background: #fff;
}

.mobile_language_dropdown .language_options {
	left: 0;
	right: auto;
}

/* Google Translate üst barını ve widget alanlarını gizle */
#google_translate_element,
.goog-te-gadget,
.goog-te-combo,
.goog-te-banner-frame,
.goog-te-balloon-frame,
.VIpgJd-ZVi9od-ORHb-OEVmcd,
.VIpgJd-ZVi9od-ORHb,
#goog-gt-tt {
	display: none !important;
	visibility: hidden !important;
	height: 0 !important;
}

body {
	top: 0 !important;
	position: static !important;
}

/* Google çeviri sonrası oluşan iframe boşluklarını gizle */
iframe.skiptranslate,
body > .skiptranslate {
	display: none !important;
	visibility: hidden !important;
	height: 0 !important;
}

/* Mobilde üst menüdeki masaüstü dropdown gizlenir */
@media (max-width: 1040px) {
	.grax_tm_topbar .language_dropdown {
		display: none !important;
	}

	.grax_tm_mobile_menu .mobile_language_dropdown {
		display: inline-flex !important;
	}
}

/* LANGUAGE DROPDOWN END */

/* STICKY HEADER LANGUAGE FIX START */

/* Sticky menüde dropdown'ın kaybolmasını engeller */
.grax_tm_topbar,
.grax_tm_topbar .container,
.grax_tm_topbar .topbar_inner {
	overflow: visible !important;
}

/* Sticky menü aktif olunca dil butonu görünür kalsın */
.grax_tm_topbar.animate .language_dropdown {
	display: inline-flex !important;
	visibility: visible !important;
	opacity: 1 !important;
	z-index: 99999 !important;
}

/* Sticky menüde TR / EN ana butonu */
.grax_tm_topbar.animate .language_current {
	background: transparent !important;
	border: 1px solid #3b1f1f !important;
	color: #3b1f1f !important;
}

/* Sticky menüde ok işareti */
.grax_tm_topbar.animate .language_current::after {
	color: #3b1f1f !important;
}

/* Sticky menüde dropdown açılır liste */
.grax_tm_topbar.animate .language_options {
	background: #fff !important;
	border: 1px solid #eee !important;
	box-shadow: 0 10px 30px rgba(0,0,0,0.15) !important;
	z-index: 99999 !important;
}

/* Sticky menüde dropdown içindeki TR / EN seçenekleri */
.grax_tm_topbar.animate .language_options button {
	color: #3b1f1f !important;
	background: transparent !important;
}

/* Hover ve aktif dil */
.grax_tm_topbar.animate .language_options button:hover,
.grax_tm_topbar.animate .language_options button.active {
	background: #f3f3f3 !important;
	color: #e8751a !important;
}

/* STICKY HEADER LANGUAGE FIX END */

/* LANGUAGE FLAG IMAGE FIX START */

.language_current,
.language_options button {
	display: inline-flex !important;
	align-items: center !important;
	gap: 7px !important;
}

.language_current {
	justify-content: center !important;
	min-width: 78px !important;
}

.language_flag_img {
	width: 20px !important;
	height: 14px !important;
	object-fit: cover !important;
	border-radius: 2px !important;
	display: inline-block !important;
	flex-shrink: 0 !important;
}

.language_code {
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: .5px !important;
	line-height: 1 !important;
}

.language_options button {
	justify-content: flex-start !important;
}

.language_options button .language_flag_img {
	width: 20px !important;
	height: 14px !important;
}

/* Sticky menüde görünürlük */
.grax_tm_topbar.animate .language_current {
	min-width: 78px !important;
	color: #3b1f1f !important;
	border: 1px solid #3b1f1f !important;
	background: transparent !important;
}

.grax_tm_topbar.animate .language_code {
	color: #3b1f1f !important;
}

.grax_tm_topbar.animate .language_options button .language_code {
	color: #3b1f1f !important;
}

.grax_tm_topbar.animate .language_options button:hover .language_code,
.grax_tm_topbar.animate .language_options button.active .language_code {
	color: #e8751a !important;
}

/* LANGUAGE FLAG IMAGE FIX END */

/* LANGUAGE DROPDOWN MENU OVERFLOW FIX START */

/* Üst menü elemanlarını tek satırda tutar */
.grax_tm_topbar .topbar_inner {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 22px !important;
	flex-wrap: nowrap !important;
}

/* Logo sabit kalsın */
.grax_tm_topbar .logo {
	flex: 0 0 auto !important;
}

/* Menü alanı esneyebilir olsun */
.grax_tm_topbar .menu {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	display: flex !important;
	justify-content: flex-end !important;
}

/* Menü liste yapısı tek satır olsun */
.grax_tm_topbar .menu ul.anchor_nav {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
	flex-wrap: nowrap !important;
	gap: 28px !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Menü item boşluklarını tema CSS'inden bağımsız düzeltir */
.grax_tm_topbar .menu ul.anchor_nav li {
	margin: 0 !important;
	padding: 0 !important;
	white-space: nowrap !important;
}

/* Menü yazıları satır kırmasın */
.grax_tm_topbar .menu ul.anchor_nav li a {
	white-space: nowrap !important;
	font-size: 15px !important;
}

/* Dil seçici sağda sabit dursun */
.grax_tm_topbar .language_dropdown {
	flex: 0 0 auto !important;
	margin-left: 14px !important;
}

/* Dil butonu biraz kompakt olsun */
.grax_tm_topbar .language_current {
	min-width: 82px !important;
	height: 32px !important;
	padding: 0 11px !important;
}

/* Dropdown içeriği taşmasın */
.grax_tm_topbar .language_options {
	min-width: 105px !important;
}

/* Sticky menüde de aynı düzen korunsun */
.grax_tm_topbar.animate .topbar_inner {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 22px !important;
	flex-wrap: nowrap !important;
}

.grax_tm_topbar.animate .menu ul.anchor_nav {
	display: flex !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
	gap: 28px !important;
}

.grax_tm_topbar.animate .menu ul.anchor_nav li a {
	white-space: nowrap !important;
	font-size: 15px !important;
}

/* 1200px altına yaklaşırken menüyü biraz sıkıştır */
@media (max-width: 1200px) {
	.grax_tm_topbar .menu ul.anchor_nav {
		gap: 22px !important;
	}

	.grax_tm_topbar .menu ul.anchor_nav li a {
		font-size: 14px !important;
	}

	.grax_tm_topbar .language_dropdown {
		margin-left: 8px !important;
	}

	.grax_tm_topbar .language_current {
		min-width: 76px !important;
		padding: 0 9px !important;
	}
}

/* 1040px altında zaten mobil menü devreye girsin */
@media (max-width: 1040px) {
	.grax_tm_topbar .language_dropdown {
		display: none !important;
	}
}

/* LANGUAGE DROPDOWN MENU OVERFLOW FIX END */

/* Sticky menüde dil yazısı */
.grax_tm_topbar.animate .language_dropdown .language_current .language_code {
	color: #000 !important;
}

/* Dark tema + sticky menü */
body.dark .grax_tm_topbar.animate .language_dropdown .language_current .language_code {
	color: #fff !important;
}


/*---------------------------------------------------*/
/*	11) GRAX CURSOR
/*---------------------------------------------------*/

.mouse-cursor{
  position: fixed;
  left: 0;
  top: 0;
  pointer-events: none;
  border-radius: 50%;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  visibility: hidden;
}
.cursor-inner {
  margin-left: -3px;
  margin-top: -3px;
  width: 6px;
  height: 6px;
  z-index: 50;
  background-color: #000;
  -webkit-transition: width .3s ease-in-out, height .3s ease-in-out, margin .3s ease-in-out, opacity .3s ease-in-out;
  transition: width .3s ease-in-out, height .3s ease-in-out, margin .3s ease-in-out, opacity .3s ease-in-out;
}
.cursor-inner.cursor-hover {
  margin-left: -40px;
  margin-top: -40px;
  width: 80px;
  height: 80px;
  background-color: #000;
  opacity: .3;
}
.cursor-outer {
  margin-left: -15px;
  margin-top: -15px;
  width: 30px;
  height: 30px;
  border: 2px solid #000;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 50;
  opacity: .5;
  -webkit-transition: all .08s ease-out;
  transition: all .08s ease-out;
}
.cursor-outer.cursor-hover{opacity: 0;}
.grax_tm_all_wrap[data-magic-cursor="hide"] .mouse-cursor{
	display: none;
	opacity: 0;
	visibility: hidden;
	position: absolute;
	z-index: -1111;
}

/*---------------------------------------------------*/
/*	12) GRAX PARTICLE EFFECT
/*---------------------------------------------------*/

.grax_tm_hero .particle_wrapper{
	position: relative;
	float: left;
	width: 100%;
	height: 100%;
}
#particles-js {
	width: 100%;
	height: 100%;
  	position: absolute;
  	z-index: 2;
}

/*---------------------------------------------------*/
/*	13) GRAX GLITCH EFFECT
/*---------------------------------------------------*/

.grax_tm_hero .glitch_wrap{
	position: relative;
	width: 100%;
	height:100%;
	float: left;
	overflow: hidden;
}
.glitch{
	position: absolute;
 	width: 100%;
 	height: 100%;
	top: 0;
 	left: 0;
	background-image: url("..//img/slider/2.jpg");
	background-size: cover;
	-webkit-background-size: cover;
	background-position: center;
	z-index: -1 !important;
	opacity: 1;
	transform: scale(1);
}
.glitch:before{
	content: "";
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
}

.grax_tm_hero .ripple{
	width: 100%;
	height: 100%;
	position: absolute;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-image: url(..//img/slider/2.png);
}
.grax_tm_hero .ripple:before{
	position: absolute;
	content: "";
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-color: rgba(0,0,0,.3);
	z-index: 1;
}
.container.water{visibility: hidden;}

.my_shape{
	position: absolute;
	width: 100%;
	left: 0px;
	bottom: -11px;
	z-index: 5;
}
.my_shape .svg{
	width: 100%;
	height: 100%;
}
.grax_tm_down.shape{
	bottom: 20%;
}
.my_shape svg{
	width: 100%;
	height: 100%;
	color: #fff;
}

.progressbar{
    position: fixed;
	height: 100px;
    width: 1px;
	bottom: 25px;
    right: -25px;
    background-color: rgba(0,0,0,.08);
    z-index: 10;
    transition: all .3s ease;
}
.progressbar.animate{
	right: 25px;
}

.progressbar .line {
	position: absolute;
    width: 1px;
	height: auto;
    background-color: rgba(0,0,0,.4);
}

.progressbar .text{
	position: absolute;
	top: -77%;
    left: 0px;
	font-family: "Poppins";
	font-size: 13px;
    transform: rotateZ(90deg);
	text-transform: uppercase;
    transform-origin: left;
	white-space: nowrap;
}
.progressbar a{
	text-decoration: none;
	color: #000;
}

/*---------------------------------------------------*/
/*  WAXON SETTINGS
/*---------------------------------------------------*/

.grax_tm_settings{
	position: fixed;
	z-index: 20;
	top: 20%;
	right: -200px;
	width: 200px;
	background-color: rgba(0,0,0,1.00);
	padding: 40px 20px 33px 30px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.grax_tm_settings.opened{
	right: 0px;
}
.grax_tm_settings .wrapper{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
}
.grax_tm_settings .icon{
	position: absolute;
	top: 0px;
	right: 100%;
	background-color: #000;
	padding: 12px 12px 4px 12px;
}
.grax_tm_settings .icon .svg{
	color: #fff;
	width: 25px;
	height: 25px;
	animation: fa-spin 2s infinite linear;
}
.grax_tm_settings .link{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 1;
}

@-webkit-keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
@keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
.grax_tm_settings .title{
	color: #fff;
	font-family: "Montserrat";
	font-weight: 600;
	position: relative;
	display: inline-block;
}
.grax_tm_settings .title:before{
	position: absolute;
	content: "";
	width: 100%;
	height: 1px;
	background-color: rgba(255,255,255,.2);
	left: 0px;
	bottom: 0px;
}
.grax_tm_settings .colors{
	margin: 0px 0px 22px 0px;
	list-style-type: none;
	padding-top: 32px;
}
.grax_tm_settings .colors li{
	margin: 0px;
	display: inline-block;
}
.grax_tm_settings .colors li a{
	text-decoration: none;
	display: inline-block;
	width: 30px;
	height: 30px;
	border-radius: 100%;
}
.grax_tm_settings .direction{
	list-style-type: none;
	margin: 0px 0px 20px 0px;
}
.grax_tm_settings .direction li{
	margin: 0px 20px 0px 0px;
	display: inline-block;
}
.grax_tm_settings .direction li a{
	opacity: .4;
	text-decoration: none;
	color: #fff; 
}
.grax_tm_settings .direction li a.active{
	opacity: 1;
}
.grax_tm_settings .direction li .svg{
	width: 25px;
	height: 25px;
}
.grax_tm_settings .colors li.bl{
	display: inline-block;
}
.grax_tm_settings .colors li.wh{
	display: none;
}
body.dark .grax_tm_settings .colors li.bl,
.grax_tm_settings.changed .colors li.bl{
	display: none;
}
body.dark .grax_tm_settings .colors li.wh,
.grax_tm_settings.changed .colors li.wh{
	display: inline-block;
}
body.dark .grax_tm_settings,
.grax_tm_settings.changed{
	background-color: #fff;
}
body.dark .grax_tm_settings .icon,
.grax_tm_settings.changed .icon{
	background-color: #fff;
}
body.dark .grax_tm_settings .icon .svg,
.grax_tm_settings.changed .icon .svg{
	color: #000;
}
body.dark .grax_tm_settings .title,
.grax_tm_settings.changed .title{
	color: #000;
}
body.dark .grax_tm_settings .title:before,
.grax_tm_settings.changed .title:before{
	background-color: rgba(0,0,0,.5);
}
body.dark .grax_tm_settings .direction li a,
.grax_tm_settings.changed .direction li a{
	color: #000;
}
body.dark .grax_tm_settings .cursor li:nth-child(1) a,
.grax_tm_settings.changed .cursor li:nth-child(1) a{
	border-color: #000;
}
body.dark .grax_tm_settings .cursor li:nth-child(1) a:before,
.grax_tm_settings.changed .cursor li:nth-child(1) a:before{
	background-color: #000;
}
body.dark .grax_tm_settings .cursor li .svg,
.grax_tm_settings.changed .cursor li .svg{
	color: #000;
}
.grax_tm_settings .cursor{
	margin: 0px;
	list-style-type: none;
	padding-top: 15px;
}
.grax_tm_settings .cursor li{
	margin: 0px 20px 0px 0px;
	display: inline-block;
}
.grax_tm_settings .cursor li a{
	text-decoration: none;
	color: #fff;
	opacity: .4;
	font-weight: 600;
}
.grax_tm_settings .cursor li a.showme{
	opacity: 1;
}
.grax_tm_settings .cursor li:nth-child(1) a{
	width: 30px;
	height: 30px;
	border-radius: 100%;
	border: 2px solid #fff;
	position: relative;
	display: inline-block;
}
.grax_tm_settings .cursor li:nth-child(1) a:before{
	position: absolute;
	content: "";
	width: 4px;
	height: 4px;
	border-radius: 100%;
	background-color: #fff;
	transform: translate(-50%,-50%);
	left: 50%;
	top: 50%;
}
.grax_tm_settings .cursor li .svg{
	width: 25px;
	height: 25px;
	color: #fff;
}
.grax_tm_settings .cursor li:nth-child(2){
	position: relative;
	top: -2px;
}
.grax_tm_settings .effect{
	margin: 0px;
	list-style-type: none;
	padding-top: 15px;
	padding-bottom: 25px;
}
.grax_tm_settings .effect li{
	margin: 0px 0px 5px 0px;
	display: inline-block;
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	border-radius: 100%;
	background-color: #fff;
	opacity: .4;
}
.grax_tm_settings .effect li a{
	text-decoration: none;
	color: #000;
	font-size: 13px;
	font-weight: 600;
	font-family: "Montserrat";
	display: block;
	position: relative;
	top: 2px;
}
.grax_tm_settings .effect li.selected{
	background-color: #fff;
	opacity: 1;
}

/*---------------------------------------------------*/
/*	GRAX INTRO
/*---------------------------------------------------*/

.grax_tm_intro_hero{
	width: 100%;
	height: 100vh;
	float: left;
	clear: both;
	position: relative;
	margin-bottom: 150px;
}
.grax_tm_intro_hero:before{
	position: absolute;
    content: "";
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;  
    background-image: url(..//img/patterns/light-honeycomb.png);
    background-repeat: repeat;
    opacity: .4; 
    z-index: 2;
}
.grax_tm_intro_hero:after{
	position: absolute;
    content: "";
    top: 0px;
   	bottom: 0px;
   	left: 0px;
   	right: 0px;
   	background-color: #000;
   	z-index: 1;
}
.grax_tm_intro_hero .content{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 5;
	width: 100%;
	padding: 0px 20px;
	text-align: center;
}
.grax_tm_intro_hero .content .name{
	font-size: 50px;
	font-weight: 800;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 10px;
	margin-bottom: 20px;
}
.grax_tm_intro_hero .content p{
	color: #fff;
	font-size: 20px;
	letter-spacing: 2px;
	font-family: "Poppins";
	font-weight: 500;
}
.grax_tm_intro_hero .grax_tm_down{
	left: 50%;
	transform: translateX(-50%);
	bottom: 5.5%;
}
.grax_tm_intro_hero .fn_animation .character{top: 15px;}
.grax_tm_intro_hero .fn_animation .character.opened{top: 0px;}
.grax_tm_intro_content{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
}
.grax_tm_intro_content .title_holder{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	text-align: center;
}
.grax_tm_intro_content .title_holder h3{
	font-size: 30px;
	font-weight: 800;
	color: #000;
	text-transform: uppercase;
	letter-spacing: 10px;
}
.grax_tm_intro_content .demo_list{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding-top: 100px;
	margin-bottom: 70px;
}
.grax_tm_intro_content .demo_list ul{
	margin: 0px 0px 0px -50px;
	list-style-type: none;
}
.grax_tm_intro_content .demo_list ul li{
	margin: 0px 0px 50px 0px;
	float: left;
	width: 50%;
	padding-left: 50px;
	position: relative; 
}
.grax_tm_intro_content .demo_list ul li .list_inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	text-align: center;
	transition: all .3s ease;
	top: 0px;
	transform: translateZ(0);
}
.grax_tm_intro_content .demo_list ul li .list_inner:hover{
	top: -10px;
}
.grax_tm_intro_content .demo_list ul li .list_inner h3{
	font-size: 20px; 
	font-weight: 600;
	padding-top: 20px;
}
.grax_tm_intro_content .demo_list ul li:last-child img{filter: blur(5px);}
.grax_tm_intro_fixed_price .pricing-info,
.grax_tm_intro_fixed_price .anim {text-decoration: none;
	color: #fff;
    font-family: "Montserrat";
    background-color: #401715;
    position: fixed;
    font-size: 22px;
    text-align: center;
    z-index: 5;
    border-radius: 100%;
    height: 70px;
    width: 70px;
    line-height: 70px;
	display: inline-block;
	bottom: 80px;
    right: 50px;
		
	-webkit-transition: all 0.2s;
	   -moz-transition: all 0.2s;
	    -ms-transition: all 0.2s;
	     -o-transition: all 0.2s;
	        transition: all 0.2s;	
		
}

@-webkit-keyframes myAnimPrice {
    0% {
        -webkit-transform: scale(.1);
        transform: scale(.1);
        opacity: 0
    }
    50% {
        opacity: .3
    }
    100% {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 0
    }
}

@keyframes myAnimPrice {
    0% {
        -webkit-transform: scale(.1);
        transform: scale(.1);
        opacity: 0
    }
    50% {
        opacity: .3
    }
    100% {
        -webkit-transform: scale(2);
        transform: scale(2);
        opacity: 0
    }
}

.grax_tm_intro_fixed_price .anim:nth-child(1) {
    -webkit-animation: myAnimPrice 2s infinite;
    animation: myAnimPrice 2s infinite
}

.grax_tm_intro_fixed_price .anim:nth-child(2) {
    -webkit-animation: myAnimPrice 2s infinite .3s;
    animation: myAnimPrice 2s infinite .3s
}

.grax_tm_intro_fixed_price .anim:nth-child(3) {
    -webkit-animation: myAnimPrice 2s infinite .6s;
    animation: myAnimPrice 2s infinite .6s
}

/*---------------------------------------------------*/
/*	14) GRAX MEDIA QUERIES (FOR SMALL DEVIVES)
/*---------------------------------------------------*/

@media (max-width: 1400px) {
	.grax_tm_modalbox_news .box_inner{width: 900px;}
}
@media (max-width: 1200px) {
	.grax_tm_modalbox_news .box_inner{width: 100%;top: 0px;bottom: 0px;}
	.grax_tm_modalbox_news .close{position: absolute;top: 20px;left: auto;right: 20px;margin-left: 0px;}
	.grax_tm_modalbox_news .close .svg{color: #777;width: 25px;height: 25px;}
}
@media (max-width: 1040px) {
	#preloader{display: none;}
	.mouse-cursor{display: none;}
	.cursor-inner{display: none;}
	.cursor-inner.cursor-hover{display: none;}
	.cursor-outer{display: none;}
	.container{padding: 0px 20px;}
	.grax_tm_topbar{display: none;}
	.grax_tm_mobile_menu{display: block;}
	.grax_tm_hero .name{font-size: 55px;}
	.grax_tm_about .about_inner{display: block;}
	.grax_tm_about .left{padding-right: 0px;width: 100%;margin-bottom: 40px;}
	.grax_tm_about .right{padding-left: 0px;width: 100%;}
	.grax_tm_portfolio ul{margin-left: -20px;}
	.grax_tm_portfolio ul li{padding-left: 20px;margin-bottom: 20px;}
	.grax_tm_news .news_list ul{margin-left: -30px;}
	.grax_tm_news .news_list ul li{padding-left: 30px;margin-bottom: 30px;}
}
@media (max-width: 768px) {
	.grax_tm_title_holder h3{letter-spacing: 5px;}
	.grax_tm_hero .name{font-size: 45px;margin-bottom: 5px;}
	.grax_tm_hero .job{font-size: 17px;}
	.grax_tm_about .right .list ul{margin: 0px;}
	.grax_tm_about .right .list ul li{width: 100%;padding-left: 0px;}
	.grax_tm_portfolio ul li{width: 50%;}
	.grax_tm_progress_part .part_inner{display: block;}
	.grax_tm_progress_part .left{width: 100%;padding-right: 0px;float: left;margin-bottom: 20px;}
	.grax_tm_progress_part .right{width: 100%;padding-left: 0px;}
	.grax_tm_talk .talk_inner{display: block;}
	.grax_tm_talk .text{padding-right: 0px;margin-bottom: 30px;}
	.grax_tm_news .news_list ul li{width: 50%;}
	.grax_tm_news .news_list ul li .details .date span{margin-left: 0px;}
	.grax_tm_news .news_list ul li .details .date span:before{display: none;}
	.grax_tm_contact .contact_inner{display: block;}
	.grax_tm_contact .left{width: 100%;margin-bottom: 20px;float: left;}
	.grax_tm_contact .right{width: 100%;padding-left: 0px;}
	.grax_tm_copyright .copyright_inner{display: block;}
	.grax_tm_copyright .logo{margin-bottom: 17px;}
	.grax_tm_copyright .social{margin-bottom: 10px;}
	.grax_tm_modalbox_news .details .title{font-size: 25px;}
	.grax_tm_modalbox_news .description_wrap{padding: 20px;}
	
	.grax_tm_intro_fixed_price{display: none;}
	.grax_tm_intro_content .title_holder h3{letter-spacing: 4px;}
	.grax_tm_intro_content .demo_list ul{margin: 0px;}
	.grax_tm_intro_content .demo_list ul li{width: 100%;padding-left: 0px;}
}
@media (max-width: 480px) {
	.grax_tm_hero .name{font-size: 30px;}
	.grax_tm_hero .job{font-size: 15px;}
	.grax_tm_portfolio ul{margin: 0px;}
	.grax_tm_portfolio ul li{width: 100%;padding-left: 0px;}
	.grax_tm_news .news_list ul{margin: 0px;}
	.grax_tm_news .news_list ul li{width: 100%;padding-left: 0px;}
}