@media only screen and (max-width: 1366px) {
	/* h1{
		font-size: 60px;
		} */
	}
	@media only screen and (max-width: 1280px) {
		h1{
			font-size: 50px;
			line-height: 4rem;
		}
	}

	@media only screen and (max-width: 1170px) {
		h1{
			font-size: 48px;
			line-height: 4rem;
		}
		p.p_2{
			font-size: 20px;
			line-height: 28px;
		}
		h3{
			font-size: 38px;
		}
		h5{
			font-size: 46px;
			line-height: 56px;
		}
		.image_design img{
			width: auto;
			max-height: unset;
			max-width: unset;
			height: calc(100% + 250px)
		}
	}
	@media only screen and (max-width: 1024px) {
		.section_2 .content_card{
			margin-top: 20px;
		}
		.section_2 h1{
			margin-bottom: 10px;
		}
		h1 {
			font-size: 42px;
			line-height: 3.5rem;
		}
		h2{
			font-size: 48px;
		}
		.circle_row{
			-webkit-transform: scale(0.8);
			-moz-transform: scale(0.8);
			-ms-transform: scale(0.8);
			-o-transform: scale(0.8);
			transform: scale(0.8);
		}
	}
	@media only screen and (max-width: 980px) {
		:root{
			--triangle_height: 250px;
		}
		.section_2 h1,
		h1{
			font-size: 42px;
		}
		h2{
			font-size: 42px;
		}
		h3{
			font-size: 30px;
		}
		h4{
			font-size: 22px;
		}
		h5{
			font-size: 42px;
		}
		p{
			font-size: 16px;
		}
		.hero_section{
			padding-top: 0px;
		}
		.triangle{
			height: var(--triangle_height);
			border-bottom: solid var(--triangle_height) var(--color_grey);
		}
		.service_box .icon_box img {
			height: 80px;
		}
		.service_card{
			margin-bottom: 80px;
		}
		.image_design img{
			width: auto;
			max-height: unset;
			max-width: unset;
			height: calc(100% + 250px)
		}
		
	}
	@media only screen and (max-width: 800px) {
		.section_2 h1,
		h1 {
			font-size: 34px;
			line-height: 3rem;
		}
		p.p_2 {
			font-size: 18px;
			line-height:26px;
		}
		h2{
			line-height: 3.75rem;
		}
		.site_button{
			height: 50px;
			margin-top: 40px;
		}
	}

	@media only screen and (max-width: 768px) {
		.section_2 h1,
		h1 {
			font-size: 30px;
			line-height: 2.8rem;
		}
		h2{
			font-size: 38px;
			line-height: 3.25rem;
		}
		p.p_2 {
			font-size: 17px;
			line-height:26px;
		}
		
		.site_button{
			height: 50px;
			margin-top: 40px;
		}
		.footer_col-4{
			flex: 0 0 50%;
			max-width: 50%;
		}
		.footer_col-4 .site_button{
			margin-top: 0;
		}
		.section_3 .col-6{
			flex: 0 0 70%;
			max-width: 70%
		}
		.section_3 .row{
			justify-content: center;
		}
		:root{
			--circle_240: 220px;
			--circle_146: 140px;
			--circle_141: 130px;
			--circle_258: 240px;
		}
		.animated{
			animation-duration: 0.7s !important;
		}
		.circle_row .animated{
			animation-duration: 1s !important;
		}
	}
	@media only screen and (max-width: 640px) {
		.hero_section .row{
			height: 76vh;
		}
		:root{
			--triangle_height: 150px;
		}
		.content_card{
			text-align: center;
		}
		.content_card h2{
			text-align: center;
		}
		h2{
			font-size: 30px;
		}
		.hero_section p{
			text-align: center;
		}
		p.p_2{
			font-size: 16px;
		}
		.site_button{
			font-size: 14px;
			padding: 0 25px;
			margin-top: 30px;
			font-weight: 600;
		}
		.col-8{
			flex: 0 0 100%;
			max-width: 100%;
		}
		.col-6{
			flex: 0 0 100%;
			max-width: 100%;
		}
		.image_wrapper{
			text-align: center;
		}
		.image_wrapper img{
			width: 70%;
			margin: 20px auto 0px;
		}
		.section_3 .col-6{
			flex: 0 0 100%;
			max-width: 100%;
		}
		.section_3{
			text-align: center;
		}
		.section_3 h5{
			font-size: 28px;
		}
		.big_image_content{
			padding-bottom: 150px;
		}
		.site_header .col-6{
			flex:  0 0 50%;
			max-width: 50%;
		}
		.section_1 .title{
			margin-bottom: 60px;
		}
		.section_1 .col-1{
			display: none;
		}
		.col-5{
			flex: 0 0 50%;
			max-width: 50%;
		}
		.hero_section .content_card{
			margin-top: 50px;
		}
		.col-20{
			flex: 0 0 33.33%;
			max-width: 33.33%;
		}
		.section_5 .col-1{
			display: none;
		}
		.col-4{
			flex: 0 0 100%;
			max-width: 100%;
		}
		.col-7{
			flex: 0 0 100%;
			max-width: 100%;
		}
		.call_img{
			justify-content: center;
			padding-bottom: 100px;
		}
		.call_img .shadow{
			right: calc(50% - 110px); 
		}
		.call_card{
			text-align: center;
		}
		.circle_row{
			transform: scale(0.6);
			margin: -120px 0;
		}
		:root{
			--circle_240: 210px;
			--circle_146: 120px;
			--circle_141: 110px;
			--circle_258: 210px;
		}
		.logo_wrapper img{
			width: 150px;
		}
		.site_header {
			top: 20px;
		}
		#site_content {
			padding-top: 91px;
		}
		.col-flex::after {
			content: "";
			background: url(../../assets/images/logos/circle_d.png);
			background-repeat: no-repeat;
			height: calc(100% + 150px);
			width: 100%;
			display: block;
			position: absolute;
			top: 0;
			left: 0%;
			z-index: -1;
			opacity: 0.2;
			background-size: 73%;
			background-attachment: fixed;
			background-position: center 90px;
			background-size: contain;
			
		}
		.col-flex.animated::after{
			animation: zoom_1 1s linear forwards;
		}
		.col-4_design {
			display: none;
		}
		.site_header{
			top: 0;
			-webkit-transition: top .25s ease;
			-moz-transition: top .25s ease;
			-ms-transition: top .25s ease;
			-o-transition: top .25s ease;
			transition: top .25s ease;
		}
		.call_img .shadow{
			top: 120px;
		}
	}

	@media only screen and (max-width: 575px) {
		h2{
			line-height: 2.75rem;
		}
		h3{
			font-size: 20px;
		}
	}
	@media only screen and (max-width: 475px){
		.brag_txt {
			margin-bottom: 50px;
		}
		#site_content {
			padding-top: 55px;
		}
		.col-5{
			flex: 0 0 100%;
			max-width: 100%;
		}
		.service_card{
			text-align: center;
		}
		
		.service_box .icon_box .shadow{
			top: 45px;
		}
		.service_box .icon_box {
			padding-bottom: 50px;
		}
		.title{
			text-align: center;
		}
		.footer_col-4{
			flex: 0 0 100%;
			max-width: 100%;
		}
		.footer_col-4 .site_button{
			margin-bottom: 25px;
		}
		.footer_col-4{
			text-align: center;
		}
		.map_white{
			margin: 0 auto;
		}
		.col-20{
			flex: 0 0 48%;
			max-width: 48%;
			margin: 1%;
		}
		.col-4_design{
			width: 100%;
			flex:  0 0 100%;
			max-width: 100px;
		}
		:root {
			--triangle_height: 100px;
		}
		h4 {
			font-size: 18px;
		}
		p {
			font-size: 14px;
		}
		.service_box .icon_box img {
			height: 60px;
		}
		.service_box .icon_box .shadow {
			top: 25px;
		}
		.service_card {
			margin-bottom: 50px;
		}
		.logo_card {
			margin-bottom: 30px;
		}
		.logo_card img {
			max-width: 140px;
			max-height: 53px;
		}
		.section_padding {
			padding: 40px 0px;
		}
		
	}
	@media only screen and (max-width: 425px){
		.section_4 .title h3{
			margin-bottom: 40px;
			margin-top: 10px;
		}
		.call_img img{
			max-width: 120px;
		}
		.call_img .shadow{
			top: 60px;
		}
		.call_img{
			padding-bottom: 70px;
		}
		h1{
			font-size: 24px;
			line-height: 2.25rem;
		}
		.section_3 h5{
			line-height: 2.25rem;
		}
		.big_image_content{
			padding-bottom: 100px;
		}
		.image_design img{
			height: 100%;
			opacity: 0.4;
		}
		.image_design{background: #000;
			height: calc(100% + 280px);

		}
		.logo_wrapper img {
			width: 110px;
			margin-top: 8px;
		}
		.logo_icon img{
			width: 40px;
		}
		h3{
			font-size: 20px;
		}
		p.p_2{
			font-size: 15px;
		}
		.card_content ul{
			padding-left: 0;
		}
	}

	@media only screen and (max-width: 375px){
		h3{
			font-size: 22px;
		}
		h4{
			font-size: 18px;
		}
		.col-20{
			flex: 0 0 70%;
			max-width: 70%;
			margin: 2% auto;
		}
		:root {
			--circle_240: 180px;
			--circle_146: 100px;
			--circle_141: 90px;
			--circle_258: 180px;
		}
		.circle_146{
			left: 215px;
		}
		.circle_141 {
			top: 300px;
		}
		.circle_258{
			top:  288px;
			left: 160px;
		}
		.call_img .shadow{
			top: 80px;
			width: 150px;
			height: 104px;
			opacity: 0.75;
			right: calc(50% - 75px);
		}

		.logo_icon img{
			width: 40px;
		}
		.call_card{
			margin-top: 0;
		}
		.service_card .card_content p{
			display: block;
			margin: 0 auto;
			font-size: 11px;
		}
	}

	@media only screen and (max-width: 320px){
		h2{
			font-size: 24px;
			line-height: 2.25rem;
		}
		:root {
			--circle_240: 140px;
			--circle_146: 90px;
			--circle_141: 70px;
			--circle_258: 160px;
		}
		.circle_146 {
			left: 166px;
		}
		.circle_141 {
			top: 250px;
		}
		.circle_258 {
			top: 245px;
			left: 130px;
		}
		:root {
			--triangle_height: 80px;
		}
		.logo_wrapper img{
			width: 140px;
		}
		.logo_icon img{
			width: 40px;
		}
	}



	.border_grey{
		border-color: var(--color_grey);
	}
	.border_yellow{
		border-color: var(--color_yellow);
	}
	.border_blue{
		border-color: var(--color_blue);
	}
	.border_green{
		border-color: var(--color_green);
	}
	.border_pink{
		border-color: var(--color_pink);
	}
	.border_red{
		border-color: var(--color_red);
	}
	.border_orange{
		border-color: var(--color_orange);
	}

	@media (max-width: 475px) and (min-width: 376px)
	{
		.service_card .card_content p {
			display: block;
			margin: 0 auto;
			font-size: 12px;
		}
		.logo_card .ray_white_img{
			margin: 20px 0 10px 0;
		}
		.logo_card .yogur_img{
			margin-top: -8px;
		}
	}
