*{margin:0; padding:0; box-sizing:border-box;}
img{max-width:100%;}
html { scroll-behavior: smooth;}
@font-face {
    font-family: 'Singolare';
    src: url('../fonts/Singolare-Bold.woff2') format('woff2'),
        url('../fonts/Singolare-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Singolare';
    src: url('../fonts/Singolare-Regular.woff2') format('woff2'),
        url('../fonts/Singolare-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


/* ===== Scrollbar CSS ===== */
  /* Firefox */
  .main_popup_body_inner_left {
    scrollbar-width: none;
    scrollbar-color: #434444 #313131;
  }

  /* Chrome, Edge, and Safari */
  .main_popup_body_inner_left::-webkit-scrollbar {
    width: 6px;
	border-radius: 12px;
  }

  .main_popup_body_inner_left::-webkit-scrollbar-track {
    background: #313131;
	border-radius: 12px;
  }

  .main_popup_body_inner_left::-webkit-scrollbar-thumb {
    background-color: #434444;
    border-radius: 12px;
    border: 0px none #ffffff;
  }



body{background:#606060; font-family: 'Montserrat', sans-serif; }

.loader{background:#3A3A3A; position:fixed; left:0; top:0; right:0; bottom:0; z-index:30;}
.loader_container{position:absolute; left:50%; top:50%; background:#ffffff; padding:10px; border-radius:10px; transform:translate(-50%, -50%); width:100%; max-width:750px; display:flex; justify-content:space-between; flex-wrap:Wrap;}
.loader_container .loader_container_left{width:41%; display:flex; flex-direction:column; justify-content:space-between; padding:15px 0 15px 15px;}

.loader_container .loader_container_left .top{}
.loader_container .loader_container_left .top img{max-width:230px;}
.loader_container .loader_container_left .middle{}
.loader_container .loader_container_left .middle p{font-size:11px; font-weight:600; margin:0; padding:0;}
.loader_container .loader_container_left .middle p:first-child{margin-bottom:15px;}
.loader_container .loader_container_left .bottom{}
.loader_container .loader_container_left .bottom h5{margin:0 0 10px 0; font-size:12px; font-weight:700;}
.loader_container .loader_container_left .bottom p{font-size:11px; line-height:15px; font-weight:400; margin:0; padding:0;}


.loader_container .loader_container_left .bottom h5:after {
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
  -webkit-animation: ellipsis steps(4,end) 900ms infinite;      
  animation: ellipsis steps(4,end) 1000ms infinite;
  content: "\2026"; /* ascii code for the ellipsis character */
  width: 0px;
}

@keyframes ellipsis {
  to {
    width: 1.25em;    
  }
}

@-webkit-keyframes ellipsis {
  to {
    width: 1.25em;    
  }
}

.loader_container .loader_container_right{width:55%; line-height:0;}
#main_container{padding:30px 0 0 30px; height:100vh; overflow:hidden;}
.main_header{padding-bottom:20px;}
.main_header .logo{}
.main_header .logo img{height:28px;} 
.main_content{display:flex; justify-content:space-between; min-height:calc(100vh - 82px);}
.main_content .tool_bar{width:70px; background:#3A3A3A; text-align:center; padding:15px 2px 2px 2px;}
.main_content .tool_bar_inner{background:#535353;  }
.main_content .tool_bar_inner ul{list-style-type: none;
    margin: 0;
    padding: 30px 10px 10px 10px;
    display: flex;
    flex-direction: column;
	align-items:center;
    background: url(../images/tool_lines.svg) center 10px no-repeat;
    background-size: 40px;}
.main_content .tool_bar_inner ul li{width:45px; margin-bottom:2px; border-radius:2px; height:40px; display:flex; align-items:center; justify-content:center; cursor:pointer;}
.main_content .tool_bar_inner ul li.divider{padding:0; margin:2px 0; background:#323033; height:2px; width:100%;}
.main_content .tool_bar_inner ul li:hover,
.main_content .tool_bar_inner ul li.active{background:#323033;}
.main_content .tool_bar_inner ul li img{max-width:30px; max-height:30px;}
.main_content .right_area{width:calc(100% - 72px); border:1px solid #000000; border-right:none; border-bottom:none;}
.main_content .right_area .right_area_header{border-bottom:1px solid #000000; background:#3A3A3A;}
.main_content .right_area .right_area_header ul{list-style-type:none; margin:0; padding:0; display:flex;}
.main_content .right_area .right_area_header ul li{border-right:1px solid #000000; min-width:380px;}
.main_content .right_area .right_area_header ul li a{color:#C2BFC0; font-size:18px; font-weight:500; text-decoration:none; display:block; padding:6px 15px 6px 35px; background:url(../images/tab_cross.svg) 10px center no-repeat; background-size:12px;}


.main_content .right_area .right_area_content{display:flex; height:calc(100% - 65px);}
.main_content .right_area .right_area_content .right_area_content_canvas{width:calc(100% - 53px); padding:80px; position:relative;}

.right_area_content_canvas.tool1{cursor: url(../images/tool1.png), auto;}
.right_area_content_canvas.tool2{cursor: url(../images/tool2.png), auto;}

.right_area_content_canvas.tool3{cursor: url(../images/tool3.png), auto;}
.right_area_content_canvas.tool4{cursor: url(../images/tool4.png), auto;}

.right_area_content_canvas.tool5{cursor: url(../images/tool5.png), auto;}
.right_area_content_canvas.tool6{cursor: url(../images/tool6.png), auto;}

.right_area_content_canvas.tool7{cursor: url(../images/tool7.png), auto;}
.right_area_content_canvas.tool8{cursor: url(../images/tool8.png), auto;}

.right_area_content_canvas.tool9{cursor: url(../images/tool9.png), auto;}
.right_area_content_canvas.tool10{cursor: url(../images/tool10.png), auto;}

.right_area_content_canvas.tool11{cursor: url(../images/tool11.png), auto;}
.right_area_content_canvas.tool12{cursor: url(../images/tool12.png), auto;}

.right_area_content_canvas.tool13{cursor: url(../images/tool13.png), auto;}
.right_area_content_canvas.tool14{cursor: url(../images/tool14.png), auto;}

.color_swapper .active{display:none;}
.color_swapper .current{display:block;}
.color_swapper.active .current{display:none;}
.color_swapper.active .active{display:block;}



.main_content .right_area .right_area_content .right_area_content_canvas .right_area_content_canvas_inner{background:#ffffff; height:100%; display:flex; align-items:center;}
.main_content .right_area .right_area_content .right_area_content_sidebar{width:53px; position:relative; z-index:2;}
.main_content .right_area .right_area_content .right_area_content_sidebar .single_panel{display: flex; justify-content: flex-start; margin: 0 0 20px 0;  flex-direction: row-reverse;}
.main_content .right_area .right_area_content .right_area_content_sidebar .single_panel .panel_trigger{min-width:53px; cursor:pointer;}
.main_content .right_area .right_area_content .right_area_content_sidebar .single_panel .panel_trigger img{width:100%;}
.main_content .right_area .right_area_content .right_area_content_sidebar .single_panel .panel{min-width:310px; visibility:hidden; opacity:0; transition:all ease 0.2s; position:relative;}
.main_content .right_area .right_area_content .right_area_content_sidebar .single_panel.active .panel{visibility:visible; opacity:1;}

.main_content .right_area .right_area_content .right_area_content_sidebar .single_panel .panel .arrow{position: absolute;
    right: 46px;
    top: 20px;
    background: url(../images/panel_arrow.svg) center center no-repeat;
    width: 18px; cursor:pointer;
    height: 13px; padding:5px; background-size:11px; border-radius:2px;}
.main_content .right_area .right_area_content .right_area_content_sidebar .single_panel .panel .arrow:hover{background: url(../images/panel_arrow.svg) center center no-repeat rgba(0,0,0,0.3); background-size:11px;}

.main_content .right_area .right_area_content .right_area_content_sidebar .single_panel:nth-child(2) .panel .arrow{top: 16px;}	

.landing_inner{display: flex; justify-content: space-between; align-items:center; margin: 0; padding: 100px 0;}
.landing_inner .landing_inner_left{width:35%;}
.landing_inner .landing_inner_left .canvas_logo{max-width:310px;}
.landing_inner .landing_inner_left h2{font-size:65px; font-weight:700; color:#1977CC; line-height:55px; position:relative; margin:50px 0;}
.landing_inner .landing_inner_left h2:before,
.landing_inner .landing_inner_left h2:after,
.landing_inner .landing_inner_left h2 strong:before,
.landing_inner .landing_inner_left h2 strong:after
{width:8px; height:8px; border:1px solid #1977CC; background:#ffffff; content:''; position:absolute; z-index:2;}
.landing_inner .landing_inner_left h2 strong{display:block;  border:1px solid #1977CC; position:relative; padding-bottom:10px;}
.landing_inner .landing_inner_left h2 span{display:inline-block; position:relative;}
.landing_inner .landing_inner_left h2 span:after{position:absolute; left:0; bottom:4px; width:100%; border-bottom:1px solid #1977CC; content:'';}

.landing_inner .landing_inner_left h2:before{left:-4px; top:-4px;}
.landing_inner .landing_inner_left h2:after{left:-4px; bottom:-4px;}

.landing_inner .landing_inner_left h2 strong:before{right:-4px; top:-4px;}
.landing_inner .landing_inner_left h2 strong:after{right:-4px; bottom:-4px;}

.landing_inner .landing_inner_left a{font-size: 28px; font-weight: 500; color: #ffffff; line-height: 30px; background: #1373E6; border-radius: 50px; padding: 15px 30px; display: inline-block; cursor:pointer;}
.landing_inner .landing_inner_left a:hover{background:#00376D; color:#1373E6;}
.landing_inner .landing_inner_left a:active{background:#7EBBED; color:#00376D;}
.landing_inner .landing_inner_right{width:50%;}
.center_container{width:100%; max-width:1260px; margin:0 auto; padding:20px;}


.main_popup_overlay{position:fixed; left:0; top:0; right:0; bottom:0; z-index:15; background:rgba(0,0,0,0.1); display:none;}

.main_popup{position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; max-width:1000px; background:#313131; border:1px solid #000000; box-shadow:0 0 15px rgba(0,0,0,0.7); z-index:16;display:none; }


.main_popup.shake { animation-name: shake;  animation-duration: 0.1s;  animation-iteration-count: 1;  animation-timing-function: linear; transform-origin: 50% 100%;}
@-webkit-keyframes shake {
  0% {
    transform:translate(-50%, -50%) scale(1.01); 
  }
  
  50% {
    transform:translate(-50%, -50%) scale(1);
  }
  
  100% {
    transform:translate(-50%, -50%) scale(1.01);
  }
}


.main_popup .main_popup_header{background:#FFFFFF; color:#808080; font-size:13px; font-weight:500; padding:10px 15px; display:flex; justify-content:space-between;}
.main_popup .main_popup_header .main_popup_close{display:none;}
.tabs-nav{background:#323232; border-bottom:1px solid #313131;}
.tabs-nav ul {margin: 0; padding: 0; display:flex; flex-wrap:wrap; list-style-type:none; justify-content:center; border-bottom:1px solid #1B1B1B;}
.tabs-nav li {color: #B3B3B3; margin:0 0 0 50px; position:relative;}
.tabs-nav li:first-child{margin-left: 0;  background: url(../images/clock.svg) left center no-repeat; background-size: 16px;
    padding-left: 22px;}	
.tabs-nav li:nth-child(2):before{position:absolute; left:-10px; top:10px; bottom:10px; width:1px; content:''; background:#B3B3B3;}
.tabs-nav a {display: block; padding: 14px 0; color: #B3B3B3; text-decoration:none; font-size:13px; line-height:14px; font-weight:500; position:relative;}
.tabs-nav a:after{height:3px; left:0; bottom:-1px; background:#ffffff; content:''; width:100%; opacity:0; position:absolute;}
.tabs-nav li.active a { color: #ffffff;}
.tabs-nav li.active a:after{opacity:1;}
.tabs-content { padding:0;}
.tabs-content > div:not(:last-child) { display: none;}

.main_popup_body_inner{display:flex; background:#1B1B1B; flex-wrap:wrap; justify-content:space-between;}
.main_popup_body_inner .main_popup_body_inner_left{width: calc(100% - 290px); background: #1B1B1B;  padding: 20px 30px;  max-height: 524px; overflow: auto;
    margin: 10px 0;}
.main_popup_body_inner .main_popup_body_inner_left .form_row{margin:0 0 20px 0;}
.main_popup_body_inner .main_popup_body_inner_left .form_row:last-child{margin:0;}
.main_popup_body_inner .main_popup_body_inner_left textarea{background:#313131; padding:15px; resize:none; border-radius:6px; width:100%; color:#ffffff; font-size:13px; font-family: 'Singolare'; border:none; height:220px;}
.main_popup_body_inner .main_popup_body_inner_right{width: 280px; padding: 40px 20px 20px 20px; overflow: hidden; background: #313131;}
.main_popup_body_inner .main_popup_body_inner_right h3{color:#ffffff; font-size:14px; margin:0 0 12px 0;}
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub{margin:0 0 10px 0;}
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub label{color:#B3B3B3; font-size:12px; font-weight:500; margin:0 0 3px 0; display:block;}
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub input[type="text"],
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub input[type="email"],
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub input[type="tel"],
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub textarea,
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub select{border:1px solid #B3B3B3; background:#313131; border-radius:6px; padding:0 10px; height:32px; width:100%; color:#ffffff; font-size:13px;}
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub select{max-width:80%;}
.custom_checkbox{display:flex; align-items:center; color:#ffffff; font-size:12px;}
.custom_checkbox input[type="checkbox"]{margin:0 7px 0 0;}
.custom_checkbox label{margin:0 !important; color:#ffffff !important}
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub textarea{padding:10px; resize:none; height:100px; font-family: 'Singolare';}
.main_popup_body_inner .main_popup_body_inner_right .form_row.textarea{display:none; }


.main_popup_body_inner .main_popup_body_inner_right .form_row .sub input[type="text"]:focus,
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub input[type="email"]:focus,
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub input[type="tel"]:focus,
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub select:focus,
.main_popup_body_inner .main_popup_body_inner_left textarea:focus
{box-shadow:none; outline:none;}


.main_popup_body_inner .main_popup_body_inner_right .form_row .sub input[type="text"].error,
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub input[type="email"].error,
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub input[type="tel"].error,
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub select.error,
.main_popup_body_inner .main_popup_body_inner_left textarea.error
{border:1px solid red;}

.main_popup_body_inner .main_popup_body_inner_right .form_row .sub label.error,
.sub label.error
{font-weight:400; color:red; font-size:13px; display:none !important;}

.main_popup_body_inner .main_popup_body_inner_right .form_row .sub button[type="submit"]{background:#1A66C1; border:2px solid #1A66C1; color:#ffffff; font-size:12px; font-weight:700; border-radius:50px; padding:10px 20px; cursor:pointer; margin:0 0 0 5px;}
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub button[type="submit"]:hover{background:#00376D; border-color:#00376D; color:#1373E6;}
.main_popup_body_inner .main_popup_body_inner_right .form_row .sub button[type="submit"]:active{background:#7EBBED; border-color:#7EBBED; color:#00376D;}

.main_popup_body_inner .main_popup_body_inner_right .form_row .sub button[type="reset"]{background:none; border:2px solid #ffffff; color:#ffffff; font-size:12px; font-weight:700; border-radius:50px; padding:10px 20px; cursor:pointer;}

.main_popup_body_inner .main_popup_body_inner_right .form_row .sub button[type="reset"]:hover{background:#ffffff; color:#111111;}

.quarter_grid{margin-left:-5px; margin-right:-5px; display:flex; flex-wrap:wrap; padding:0;}
.quarter_grid .quarter_grid_single{padding-left:5px; padding-right:5px; width:25%; margin:0 0 10px 0;}
.quarter_grid .quarter_grid_single_inner{background:#313131; border-radius:4px; text-align:center; border-radius:4px; display:flex; min-height:150px; justify-content:center; align-items:center; flex-direction:column; text-decoration:none; color:#ffffff;}
.quarter_grid .quarter_grid_single_inner .working_time{color:#ffffff; font-size:13px; font-weight:500;}
.weekend_time_trigger{text-align: center; color: #ffffff; font-weight: 700; font-size: 13px; margin: 40px 0 20px 0; cursor:pointer;}
.quarter_grid .quarter_grid_single_inner .working_time strong{display:block; font-weight:400;}
.quarter_grid .quarter_grid_single_inner .social_icon{font-size:45px;}
.quarter_grid .quarter_grid_single_inner .social_name{display:none;}
.quarter_grid .quarter_grid_single_inner .service_icon{margin:0 0 10px 0;}
.quarter_grid .quarter_grid_single_inner .service_icon img{height:50px;}
.quarter_grid .quarter_grid_single_inner .service_text{font-size:13px; font-weight:500;}
.map a{display:block; color:#ffffff; text-decoration:none; text-align:center; font-size:15px; margin:25px 0 0 0;}
.map a.direction_btn{display: none;  margin: 20px auto 0 auto;  background: #1b1b1b;  color: #ffffff; text-decoration: none; text-align: center; font-size: 12px; width: 160px;
    border-radius: 30px; padding: 15px 20px;} 
.weekend_time{display:none;}
.weekend_time.active{display:flex;}
.success_message{position: absolute; width: 100%; left: calc(50% - 140px); top: 50%; max-width: 400px; transform: translate(-50%, -50%); background: #535353; border: 1px solid #535353; box-shadow: 0 0 15px rgb(0 0 0 / 50%); display:none;}
.form_dialog_header{background:#FFFFFF; padding:7px 13px; color:#000000; font-size:12px;}
.success_message .form_dialog_body{padding: 12px 15px 12px 80px; background: url(../images/green_check.svg) 20px 15px no-repeat; background-size: 42px;}
.success_message .form_dialog_body p{color:#FFFFFF; font-size:12px; line-height:17px; max-width:260px;}
.success_message .form_dialog_body .dialog_lower{display:flex; justify-content:space-between; align-items:center; margin:25px 0 0 0;}
.success_message .form_dialog_body .dialog_lower span{color:#FFFFFF; font-size:11px; display:flex; align-items:center;}
.success_message .form_dialog_body .dialog_lower span input[type="checkbox"]{margin:0 8px 0 0;}
.success_message .form_dialog_body .dialog_lower a{background:#46A0F5; color:#ffffff; text-decoration:none; text-transform:uppercase; font-size:12px; padding:4px 30px; border-radius:30px; cursor:pointer;}


.right_area_footer{background: #3A3A3A; text-align: center;  font-size: 12px;  height: 30px; color: #898989; line-height: 30px;}

.isotope_grid{}
.isotope_grid > div {display: flex; justify-content: center; align-items: center;}
.isotope_grid > div > img {width: 100%;	height: 100%; object-fit: cover; border-radius: 6px;}

.isotope_grid {	display: grid;	grid-gap: 10px;	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));grid-auto-rows: 200px;	grid-auto-flow: dense;}
.isotope_grid .wide {grid-column: span 2;}
.isotope_grid .tall {grid-row: span 2;}
.isotope_grid .big {grid-column: span 2;grid-row: span 2;}


