/*all fonts attachment start*/
@font-face { font-family: 'BrandonGrotesque-Bold'; src: url('font/BrandonGrotesque-Bold/BrandonGrotesque-Bold.eot?#iefix') format('embedded-opentype'), url('font/BrandonGrotesque-Bold/BrandonGrotesque-Bold.otf') format('opentype'), url('font/BrandonGrotesque-Bold/BrandonGrotesque-Bold.woff') format('woff'), url('font/BrandonGrotesque-Bold/BrandonGrotesque-Bold.ttf') format('truetype'), url('font/BrandonGrotesque-Bold/BrandonGrotesque-Bold.svg#BrandonGrotesque-Bold') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'BrandonGrotesque-Medium'; src: url('font/BrandonGrotesque-Medium/BrandonGrotesque-Medium.eot?#iefix') format('embedded-opentype'), url('font/BrandonGrotesque-Medium/BrandonGrotesque-Medium.otf') format('opentype'), url('font/BrandonGrotesque-Medium/BrandonGrotesque-Medium.woff') format('woff'), url('font/BrandonGrotesque-Medium/BrandonGrotesque-Medium.ttf') format('truetype'), url('font/BrandonGrotesque-Medium/BrandonGrotesque-Medium.svg#BrandonGrotesque-Medium') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'BrandonGrotesque-Light'; src: url('font/BrandonGrotesque-Light/BrandonGrotesque-Light.eot?#iefix') format('embedded-opentype'), url('font/BrandonGrotesque-Light/BrandonGrotesque-Light.otf') format('opentype'), url('font/BrandonGrotesque-Light/BrandonGrotesque-Light.woff') format('woff'), url('font/BrandonGrotesque-Light/BrandonGrotesque-Light.ttf') format('truetype'), url('font/BrandonGrotesque-Light/BrandonGrotesque-Light.svg#BrandonGrotesque-Light') format('svg'); font-weight: normal; font-style: normal; }

/*smooth scrolling start*/

/*html {
  scroll-behavior: smooth;
}*/

/*smooth scrolling close*/

/* all fonts attachment end*/

body, html { color: #777; font-weight: 400; overflow-x: hidden; }
h2, h3, h4 { font-family: 'BrandonGrotesque-Bold'; }
h2 { text-transform: uppercase; margin: 0 0 20px 0; font-weight: 800; font-size: 36px; color: #333; }
h3 { font-size: 20px; font-weight: 600; color: #333; }.menu-change-alt .navbar-header .logo-icon
h4 { font-size: 18px; color: #333; font-weight: 600; }
h5 { text-transform: uppercase; font-weight: 700; line-height: 20px; }
p { font-size: 15px; }
p.intro { margin: 12px 0 0; line-height: 24px; }
a { color: #000; font-weight: 400; }
a:hover, a:focus { text-decoration: none; color: #fff; }
ul, ol { list-style: none; }
ul, ol { padding: 0; webkit-padding: 0; moz-padding: 0; }
hr { height: 2px; width: 70px; text-align: center; position: relative; background: #1E7A46; margin-bottom: 20px; border: 0; }
.no-padding { padding: 0px; }
.container { width: 90%; margin: auto; }

/* Navigation area css start */
#menu { padding: 15px; transition: all 0.8s; margin-top: 15px; margin-bottom: 0; }
#menu.navbar-default { background-color: transparent; border: none; box-shadow: none; }
#menu a.navbar-brand { font-family: 'BrandonGrotesque-Bold'; font-size: 24px; font-weight: 700; color: #333; text-transform: uppercase; }
#menu.navbar-default .navbar-nav>li>a { font-family: 'BrandonGrotesque-Bold'; color: #fff; font-size: 13px; font-weight: 400; padding: 0; border-radius: 0; margin: 47px 10px 0px 10px; display: inline-block; float: left; }
.nav-link-select-left li a { text-transform: uppercase; font-size: 14px; }
.nav-link-select-left { margin-left: 70px; }
.nav-link-select-right { padding-right: 70px; }
.logo-icon { height: auto; width: 100%; }
#menu.navbar-default .navbar-nav>li>a:after { display: block; position: absolute; left: 0; bottom: -1px; width: 0; height: 2px; background: linear-gradient(to right, #ff0000 0%, #ff0000 100%); content: ""; transition: width 0.2s; }
.nav-link-select-right li a:after { display: none !important; }
.nav-link-select-right li a { font-size: 13px !important; }
#menu.navbar-default .navbar-nav>li>a:hover:after { width: 100%; }
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus { background-color: transparent; }

/* .navbar-default .navbar-nav>.active>a:after, .navbar-default .navbar-nav>.active>a:hover:after, .navbar-default .navbar-nav>.active>a:focus:after {
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  bottom: -1px !important;
  width: 100% !important;
  height: 2px !important;
  background: linear-gradient(to right, #6372ff 0%, #5ca9fb 100%) !important;
  content: "" !important;
  transition: width 0.2s !important;
} */
.navbar-default .navbar-nav li a.active:after, .navbar-default .navbar-nav li a:hover:after, .navbar-default .navbar-nav li a:focus:after { display: block !important; position: absolute !important; left: 0 !important; bottom: -1px !important; width: 100% !important; height: 2px !important; background: linear-gradient(to right, #ff0000 0%, #ff0000 100%) !important; content: "" !important; transition: width 0.2s !important; }
.navbar-toggle { border-radius: 0; }
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color: #fff; border-color: #608dfd; }
.navbar-default .navbar-toggle:hover>.icon-bar { background-color: #608dfd; }
.section-title { margin-bottom: 70px; }
.section-title h2 { position: relative; margin-top: 10px; margin-bottom: 15px; padding-bottom: 15px; }
.section-title h2::after { position: absolute; content: ""; background: linear-gradient(to right, #5ca9fb 0%, #6372ff 100%); height: 4px; width: 60px; bottom: 0; margin-left: -30px; left: 50%; }
.section-title p { font-size: 18px; }
.btn-find-put-more { font-family: 'BrandonGrotesque-Bold'; text-transform: uppercase; color: #fff; letter-spacing: 1px; margin: 0; font-size: 15px; font-weight: bold; border-radius: 25px; transition: all 0.5s linear; border: 0; position: relative; right: -70%; }
.btn-find-put-more::after { content: ""; position: absolute; left: -474%; bottom: 19px; height: 2px; width: 470%; background: #ff0000; transition: 0.5s; }
.btn-find-put-more:hover::after, .btn-find-put-more:active::after, .btn-find-put-more:focus::after { content: ""; width: 400%; transition: 0.5s; }
.btn-find-put-more:hover, .btn-find-put-more:active, .btn-find-put-more:focus { color: #fff; }
.btn:active, .btn.active { background-image: none; outline: 0; -webkit-box-shadow: none; box-shadow: none; }
a:focus, .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { outline: none; outline-offset: none; }

/*css menu design changes with jquery*/
.menu-change .nav-link-select-left { display: block; }
.menu-change-alt .nav-link-select-left { display: block; }
.menu-change-alt { background: #03040c !important; padding-top: 0; margin-top: 0 !important; transition: 0.3s; }
.menu-change-alt .navbar-header .logo-icon { width: 170px; height: 55px; transform: scale(1); padding: 0px 0px 10px 0px; margin-top: -10px; }
.menu-change-alt .navbar-nav>li>a { margin: 20px 10px 0 10px !important; }
.menu-change #closebtn { display: none; }

/*css menu design changes with jquery*/

/* Navigation area css start */

/* banner section area start css */

.intro { display: table; width: 100%; padding: 0; }
.intro .overlay { background: rgba(0, 0, 0, 0.2); }
.intro h1 { font-family: 'BrandonGrotesque-Bold'; color: #fff; font-size: 15px; font-weight: bold; text-transform: uppercase; margin-top: 0; margin-bottom: 10px; letter-spacing: 0.4px; }
.intro .banner-box { position: static; /* position: absolute;*/ top: 0; left: 0; width: 100%; height: auto; object-fit: cover; }
.intro h1 span { font-weight: 800; color: #5ca9fb; }
.intro p { color: #fff; font-size: 60px; font-weight: 300; line-height: 60px; margin: 0 auto; margin-bottom: 60px; font-family: 'BrandonGrotesque-Medium'; letter-spacing: 1px; font-weight: 500; }
#banner_frame .intro-text { padding-bottom: 100px; text-align: left; padding-top: 67vh; font-family: 'BrandonGrotesque-Medium'; }

/* banner section area start css */

/* start services */

#services { display: block; float: left; width: 100%; background: #8e041b; position: relative; left: 0px; padding: 100px 0px; }
.services_frame { width: 63%; height: auto; display: inline-block; }
.services_frame h2 { color: #fff; text-transform: initial; font-size: 45px; line-height: 50px; font-family: 'BrandonGrotesque-Medium'; font-weight: 500; }
.services_frame p { color: #fff; text-transform: initial; font-size: 16px; line-height: 23px; font-family: 'BrandonGrotesque-Light'; font-weight: 300; }
.menu_mark { color: #ff0000; font-family: 'BrandonGrotesque-Bold'; font-size: 15px; font-weight: bold; text-transform: uppercase; margin-top: 0; margin-bottom: 10px; text-align: center; }
.menu_mark span { color: #fff; font-family: 'BrandonGrotesque-Bold'; font-size: 15px; font-weight: bold; text-transform: uppercase; margin-top: 0; margin-bottom: 10px; padding-right: 10px; }
.kajaine-icon { padding: 50px 0px 0px 0px; text-align: left; }
.kajaine-icon h4 { color: #fff; font-weight: 300; font-family: 'BrandonGrotesque-Bold'; font-size: 11px; text-transform: uppercase; max-height: 200px; height: 51px;  /*cursor: pointer;*/ line-height: 20px; }
.kajaine-icon h4 span { color: #fff; font-weight: 500; font-family: 'BrandonGrotesque-Bold'; font-size: 15px; text-transform: uppercase; line-height: 20px; }
#services .kajaine-icon h4 { cursor: default; }
.kajaine-icon h4 p { color: #fff; font-family: 'BrandonGrotesque-Light'; font-weight: 300; font-size: 12px; line-height: 14px; text-transform: lowercase; }
.kajaine-icon span img { margin-bottom: 44px; }
.probate .kajaine-icon span img { height: 75px;}
.kajaine-icon h4::after { content: ""; position: absolute; left: 0px; height: 2px; width: 82px; background: #c7020d; bottom: 31%; transform: translate(0%, 50%); transition: 0.3s; }
.kajaine-icon:hover h4::after, .kajaine-icon:active h4::after, .kajaine-icon:focus h4::after { transition: 0.3s; width: 50px; }

/*end services */

/*right side menu animation*/

.menu_nav_animation { position: fixed; right: 50px; top: 0px; width: 100px; height: 100vh; z-index: 1; }
.menu_nav_animation::before { content: ""; position: absolute; left: 45%; top: 0px; height: 30%; width: 2px; background: #ff0000; }
.menu_nav_animation::after { content: ""; position: absolute; left: 45%; bottom: 0px; height: 28%; width: 2px; background: #ff0000; }
.menu_nav_animation ul { display: block; position: relative; top: 47.9%; transform: translate(41%, -50%); }
.menu_nav_animation ul li { display: block; height: 20px; width: 20px; transition: 0.5s; margin: 30px 0px; border-radius: 100px; cursor: pointer; }
.menu_nav_animation ul li a::before { content: ""; height: 7px; width: 7px; background: #fff; position: absolute; left: 2px; transition: 0.3s; margin-top: 5px; border-radius: 100px; }
.menu_nav_animation ul li a:hover::before { content: ""; height: 7px; width: 7px; background: #ff0000; position: absolute; left: 2px; transition: 0.3s; margin-top: 5px; border-radius: 100px; transform: scale(1.9); }
.menu_nav_animation .color_div li a::before { background: #ff0000; }
.menu_nav_animation ul li .menu_label { font-size: 17px; color: #ff0000; position: absolute; right: 120px; text-align: right; opacity: 0; margin-top: -4px; text-transform: uppercase; }
.menu_nav_animation ul li:hover .menu_label { opacity: 1; }
.menu_nav_animation ul li .menu_label:hover, .menu_nav_animation ul li .menu_label:focus, .menu_nav_animation ul li .menu_label:active, .menu_nav_animation ul li .menu_label:visited { font-size: 17px; transition: 0.3s; color: #ff0000; }
.menu_nav_animation ul li:hover .menu_label, .menu_nav_animation ul li:active .menu_label, .menu_nav_animation ul li:visited .menu_label { width: 150px; }

/*new right side menu set up*/

/*
.menu_nav_animation .pagination a {
  display:block;
  height:20px;
  margin-bottom:5px;
  color:white;
  position:relative;
  padding:4px;
}
.menu_nav_animation .pagination a.active:after {
    box-shadow: inset 0 0 0 5px #ff0000;
    border: none;
    height: 10px;
    width: 10px;
}
.menu_nav_animation .pagination a .hover-text {
  position:absolute;
  right:15px;
  top:7px;
  opacity:0;
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
  padding-right: 15px;
}
.menu_nav_animation .pagination a:hover .hover-text {
  opacity: 1;
}
.menu_nav_animation .pagination a:after {
    -webkit-transition: box-shadow 0.5s ease;
    transition: box-shadow 0.5s ease;
    width: 7px;
    height: 7px;
    display: block;
    border-radius: 50%;
    content: '';
    position: absolute;
    margin: auto;
    top: 0;
    right: 4px;
    bottom: 0;
    background: #fff;
}



.menu_nav_animation .vertical-center p.cta {
  margin-top:5px;
}
.menu_nav_animation .vertical-center a:link,
.menu_nav_animation .vertical-center a:visited {
color: white;
  text-decoration:none;

  font-size:0.6em;
}
.menu_nav_animation .vertical-center a:hover {
  text-decoration: underline;
}
.menu_nav_animation .arrow {
  position: relative;
  padding-right:15px;
}

.menu_nav_animation .arrow:before,
.menu_nav_animation .arrow:after {
  content:'';
  position: absolute;
  right:0;
  top:7px;

  width:2px;
  height:12px;
  background: white;
}
.menu_nav_animation .arrow:before {
  transform: rotate(45deg);
  top:15px;
}
.menu_nav_animation .arrow:after {
  transform: rotate(-45deg);

}

.menu_nav_animation .pagination li{list-style: none;}


.menu_nav_animation ul li {
    display: block;
    height: 20px;
    width: 20px;
    transition: 0.5s;
    margin: 20px 0px;
    border-radius: 100px;
    cursor: pointer;
    transform: translate(-10px,0px);
}
.menu_nav_animation .pagination > li > a, .pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #ffffff;
    text-decoration: none;
    background-color: #fff0;
    border: 1px solid #ddd0;
    font-size: 14px;
}
.menu_nav_animation ul li::before {
    content: "";
    height: 5px;
    width: 5px;
    background: #ffffff00;
    position: absolute;
    left: 2px;
    transition: 0.3s;
    margin-top: 5px;
    border-radius: 100px;
}.menu_nav_animation ul li:hover::before{display: none;} 
.menu_nav_animation .pagination > li > a:hover, .menu_nav_animation .pagination > li > span:hover, 
.menu_nav_animation .pagination > li > a:focus, .menu_nav_animation .pagination > li > span:focus {
    z-index: 2;
    color: #ffffff;
    background-color: transparent;
    border-color: transparent;
    line-height: 4px;
}*/

/*right side menu animation*/

/* software section start*/

main { display: block; width: 100%; }
#software { background: #13224c; padding: 100px 0px; }
.software_frame { width: 90%; height: auto; display: inline-block; }
.software_frame h2 { color: #fff; text-transform: initial; font-size: 45px; line-height: 50px; font-family: 'BrandonGrotesque-Medium'; font-weight: 500; padding-bottom: 15px; }
.services_right_content { padding-bottom: 50px; }
.software_frame p { color: #fff; text-transform: initial; font-size: 18px; line-height: 24px; font-family: 'BrandonGrotesque-Light'; font-weight: 300; }
.services_partner { padding: 20px 0px; }
.brd_t { border-top: 1px solid #991b30; border-bottom: 1px solid #991b30; }
.brd_b { border-bottom: 1px solid #991b30; }
.services_partner .services_icon { padding: 10px; vertical-align: middle; height: 100px; }
.services_partner p { font-size: 15px; font-weight: 300; font-family: 'BrandonGrotesque-Light'; line-height: 22px; margin: 0; text-align: left; }
.services_icon img { vertical-align: middle; padding-top: 0; height: 100%; width: auto; margin: auto; }
.menu_mark p { float: right; text-align: left; position: relative; left: -43px; line-height: 20px; }
.services_right_content p a { font-family: 'BrandonGrotesque-Bold'; text-transform: uppercase; color: #ff0000; letter-spacing: 1px; margin: 0; font-size: 15px; font-weight: bold; border-radius: 25px; transition: all 0.5s linear; border: 0; }
.services_right_content p { color: #fff; text-transform: initial; font-size: 18px; line-height: 24px; font-family: 'BrandonGrotesque-Light'; font-weight: 300; }

/* software section close*/

/* about section start*/

#about { background: #13224c; padding: 100px 0px; background-image: url(../images/images_02.jpg); background-position: right top; background-repeat: no-repeat; background-size: auto 100%; position: relative; }
.about-frame-left { display: inline-block; float: left; width: 100%; z-index: -1; }
.about-frame-right { padding: 0px 0px; margin: 0px; display: inline-block; float: right; transform: translate(20%, 0%); position: absolute; right: 0; overflow: hidden; height: 685px; }
.about_frame { width: 100%; height: auto; display: inline-block; }
.about_frame h2 { color: #fff; text-transform: initial; font-size: 45px; line-height: 50px; font-family: 'BrandonGrotesque-Medium'; font-weight: 500; }
.about_frame p { color: #fff; text-transform: initial; font-size: 15px; line-height: 22px; font-family: 'BrandonGrotesque-Light'; font-weight: 300; width: 80%; }
.about-banner { position: relative; width: 100%; }

/* about section close*/

/* team section start*/

#team { background: #fff; padding: 100px 0px; }
.kajaine-team, .kajaine-team .panel-heading { background: transparent; border: none; box-shadow: none; }
.kajaine-team .nav li a { font-family: 'BrandonGrotesque-Bold'; text-transform: uppercase; cursor: pointer; line-height: 20px; color: #666; font-size: 16px; font-weight: 500; box-shadow: none; border: none; border-bottom: 2px solid #fff; transition: 0.3s; padding: 0px 15px 30px 8px !important; }
.kajaine-team .panel-heading { padding: 0px !important; }
.kajaine-team .nav li:hover a, .kajaine-team .nav li:focus a, .kajaine-team .nav li:visited a, .kajaine-team .nav li:active a, .kajaine-team .nav .active:hover a, .kajaine-team .nav .active:visited a, .kajaine-team .nav .active:active a, .kajaine-team .nav .active:focus a, .kajaine-team .nav .active a { font-family: 'BrandonGrotesque-Bold'; text-transform: uppercase; cursor: pointer !important; line-height: 20px; color: #c40303 !important; font-weight: 500; box-shadow: none; border: none !important; border-bottom: 2px solid #c40303 !important; transition: 0.3s; background: none; }
#team .tab-pane p { color: #fff; text-transform: initial; font-size: 18px; line-height: 24px; font-family: 'BrandonGrotesque-Light'; font-weight: 300; }
#team .panel-body { padding: 40px 50px; background: #13224c; }
.brek:after { content: none; position: absolute; left: 185px; top: -6px; height: 2px; width: 10px; font-size: 24px; color: #666; }
.brek:before { content: "|"; position: absolute; left: -6px; top: -3px; height: 2px; width: 10px; font-size: 24px; color: #666; }

/* team section close*/

/* trade associate section start*/

#trade-association { background: #fff; padding: 100px 0px; }
.trade_boxs img { width: 100%; height: auto; }

/* trade associate section close*/

/* news section start*/

#news { background: #fff; padding: 100px 0px; }
.news_boxs img { width: 100%; height: auto; }
.news_cube h3 { font-size: 25px; font-weight: 300; line-height: 27px;  /* color: #c00023; */ color: #ff0000; }
.news_cube p { font-size: 15px; font-weight: 500; line-height: 22px; color: #000; font-family: 'BrandonGrotesque-Light'; }
.news_btn_more { color: #9c1f1f; letter-spacing: 1px; margin: 0; padding: 100px 0px 0px 0px; }
.news_btn_more a { font-family: 'BrandonGrotesque-Bold'; text-transform: uppercase;  /* color: #9c1f1f; */ color: #ff0000; letter-spacing: 1px; font-size: 15px; font-weight: bold; }

/* news section close*/

/* contact section start*/

#contact { background: #0e0c0c; padding: 100px 0px; }
.contact_data textarea { font-family: "Roboto", Helvetica, Arial, sans-serif; }
.contact_frame { width: 57%; height: auto; display: inline-block; padding-bottom: 50px; }
.contact_frame h2 { color: #fff; text-transform: initial; font-size: 45px; line-height: 50px; font-family: 'BrandonGrotesque-Medium'; font-weight: 500; }
.contact_frame p { color: #fff; text-transform: initial; font-size: 18px; line-height: 24px; font-family: 'BrandonGrotesque-Light'; font-weight: 300; }
.contact_data .wrap { width: 100%; height: 100%; margin-left: auto; margin-right: auto; position: relative; }
.contact_data .box { font-size: 1.2em; line-height: 1.6em; text-align: center; }

/*screen resolutions lower than 620px*/
@media all and (max-width:1180px) {
  .contact_data .wrap { width: 100%; height: 100%; margin-left: auto; margin-right: auto; position: relative; }
}
.contact_data h2 { margin-bottom: 50px; position: relative; display: block; }
.contact_data p a { color: #00B16A; text-decoration: none; }
.contact_data .wrap { text-align: center; width: 100%; }
.contact_data .box { text-align: center; margin: 5% 0 0 0; width: 100%; }
.contact-form { width: 100%; padding: 40px 0px; margin: 0px; }
.contact-form .input-block { background-color: transparent; border: none; width: 95%; height: 60px; border-bottom: 1px solid #ff0000; margin: 0; position: relative; margin-bottom: 20px; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.contact-form .textarea { width: 97.5%; border-bottom: 1px solid #ff0000; }
.contact_data .contact-form .input-block.textarea { height: auto; }
.contact_data .contact-form .input-block.textarea .form-control { height: auto; resize: none; }
.contact_data .contact-form .input-block label { position: absolute; left: 10px; top: 25px; display: block; margin: 0; font-weight: 400; z-index: 1; color: #fff; font-size: 18px; line-height: 10px; font-family: 'BrandonGrotesque-Light'; }
.contact_data .contact-form .input-block .form-control { background-color: transparent; margin: 0; outline: none; border: none; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; height: auto; padding: 30px 10px; width: 100%; position: relative; z-index: 2; font-size: 18px; color: #fff; font-family: 'BrandonGrotesque-Light'; }
.contact_data .contact-form .input-block .form-control:focus label { top: 0; }
.contact_data .contact-form .square-button { background-color: transparent; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; padding: 0 60px; height: 60px; cursor: pointer; outline: none; width: auto; min-width: 200px; border: 1px solid #ff0000; color: #ff0000; font-family: 'BrandonGrotesque-Bold'; font-size: 15px; font-weight: bold; text-transform: uppercase; margin-top: 10px; margin-bottom: 10px; text-align: center; }
.contact_data .contact-form .square-button:hover, .contact-form .square-button:focus { background-color: #ff0000; box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);  /*transform: translateY(4px);*/ color: #fff; transition: 0.5s; border: 2px solid #ff0000; }
@media (min-width:768px) {
  .contact_data .contact-wrap { margin: auto; }
}
@media (max-width:868px) {
  .contact_data .contact-form { width: 100%; padding: 40px; }
}
@media (max-width:568px) {
  .contact_data .contact-form { padding: 10px; }
}

/*----page styles---*/
.contact_data .contact-wrap h1 { background-color: white; color: #ff7c62; padding: 40px; margin: 0 0 50px; font-size: 30px; text-transform: uppercase; font-weight: 700; text-align: center; }
.contact_data .contact-wrap h1 small { font-size: 18px; display: block; text-transform: none; font-weight: 300; margin-top: 10px; color: #ff7c62; }

/* contact section close*/

/*bottom footer start*/

.bottom-footer { padding: 0px; margin: auto; background: #0e0c0c; }
.bottom-footer p { color: #fff; font-size: 12px; font-weight: 300; }
.left_content { text-align: left; padding: 0px 20px; }
.right_content { text-align: right; padding: 0px 20px; position: relative; z-index: 9; }
.bottom-footer p span, .bottom-footer p a { color: #ff0000; font-size: 12px; font-weight: 300; }

/*bottom footer close*/

/* button menu bar design
*/

.open-m-d { position: fixed; width: 44px; height: 40px; top: 62px; right: 5%; transform: translate(-22px, -20px); padding: 4px; transition: .25s; z-index: 9984; }
.open-m-d:hover { cursor: pointer; }
.menu-change .open-m-d { display: none; }
.menu-change-alt .open-m-d { display: block; }
.open-m-d .menu-bar { position: absolute; border-radius: 2px; width: 80%; transition: .5s; }
.open-m-d .menu-bar-top { border: 2px solid #fff; border-bottom: none; top: 0; }
.open-m-d .menu-bar-middle { height: 2px; background-color: #fff; margin-top: 7px; margin-bottom: 7px; top: 4px; }
.open-m-d .menu-bar-bottom { border: 2px solid #fff; border-top: none; top: 22px; }
.button-open-m-d .menu-bar-top { transform: rotate(45deg) translate(8px, 8px); transition: .5s; }
.button-open-m-d .menu-bar-middle { transform: translate(230px); transition: .1s ease-in; opacity: 0; }
.button-open-m-d .menu-bar-bottom { transform: rotate(-45deg) translate(8px, -7px); transition: .5s; }
.button-open-m-d .nav-link-select-left { display: block; }

/* end menu bar design*/

/*menu design work */

.navigation { width: 100%; position: fixed; z-index: 9999992; top: 0; left: 0; background-color: transparent; overflow: hidden; transition: all 0.4s ease-in-out; padding-top: 0px; }
.navigation a { text-decoration: none; }
.navigation ul { margin-top: 0px; text-align: center; list-style: none; margin-left: auto; margin-right: auto; }
.menulist { width: 100%; display: none; opacity: 0; transition: opacity 2s; -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: .6s; transition-duration: .6s; -webkit-transition-timing-function: ease; transition-timing-function: ease; }
.closebtn-m-d .menulist { position: fixed; top: 20%; height: 100vh; z-index: 99999; display: block; margin: auto; left: 6%; float: left; text-align: left; opacity: 1; transition: opacity 1s; -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: .6s; transition-duration: .6s; -webkit-transition-timing-function: ease; transition-timing-function: ease; cursor: default; }
.img_header_bottom { width: 100%; display: none; }
.closebtn-m-d .img_header_bottom { width: 700px; display: block; position: absolute; bottom: 170px; height: auto; z-index: -12; right: 0; transition: 1s; }
.menulist li { display: inline-block; float: left; width: 13%; -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: .6s; transition-duration: .6s; -webkit-transition-timing-function: ease; transition-timing-function: ease; cursor: pointer; }
.inner_list { cursor: default; }
.inner_list li a { cursor: pointer; }
.menulist li a { font-size: 20px; font-family: 'BrandonGrotesque-Bold'; text-transform: uppercase; }
.menulist li .inner_list li a { color: #fff; font-size: 16px; font-family: 'BrandonGrotesque-Light'; line-height: 34px; text-transform: capitalize; }
.menulist li .inner_list li { display: block; float: left; width: 95%; text-align: left; padding-left: 10px; -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: .6s; transition-duration: .6s; -webkit-transition-timing-function: ease; transition-timing-function: ease; }
.menulist li .inner_list li:hover { padding-left: 20px; -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: .6s; transition-duration: .6s; -webkit-transition-timing-function: ease; transition-timing-function: ease; }

/*
#topNav {
    background-image: url(../images/icons/7.png);
    background-size: auto;
    background-position: right bottom;
    background-repeat: no-repeat;
    margin-top: -100px;
}
*/
.logo { text-align: center; margin: 0 auto; }
.line1, .line2, .line3 { margin-top: 7px; background-color: #fff; width: 25px; height: 2px; display: block; position: relative; opacity: 1.0; border-radius: 15%; transition: all .3s; }
.line1.active { transform: rotate(270deg); opacity: 0.0; background-color: #fff; top: 5px; }
.line2.active { transform: rotate(45deg); background-color: #fff; left: -1px; top: 2px; }
.line3.active { transform: rotate(-40deg); background-color: #fff; top: -7px; }
.menuitems { padding-top: 12px; padding-bottom: 12px; text-decoration: none; list-style: none; font-weight: 300; font-size: 2em; display: inline-block; position: relative; text-align: center; color: #fff; transition: all .5s ease-in-out; -webkit-transition: width 2s;  /* Safari */ -webkit-transition-timing-function: linear;  /* Safari */ transition: width 2s; transition-timing-function: linear; }
.menuitems:hover { color: #fff; }
.menuitems:after { content: ''; display: block; width: 0; height: 1px; background: linear-gradient(to right, #ff0000 0%, #ff0000 100%); transition: width .2s; }
.menuitems:hover::after { width: 100%; }
#closebtn { height: 25px; width: 25px; position: absolute; text-decoration: none; top: 26px; right: 4%; font-size: 36px !important; margin-right: 50px; z-index: 999999; color: #fff; cursor: pointer; trainsition: background-position .3s; }
.menu-change .closebtn { display: none !important; }
.menu-change-alt .closebtn { display: block !important; }
.menu_nav_animation  .color_div li::before { background: #ff0000; }
.read_more_btn { position: absolute; bottom: 25px; right: 39px; background: #c40303; border-radius: 90px; z-index: 99; transition: 0.4s; border: 1px solid #c40303; height: 28px; width: 28px; }
.read_more_btn:hover, .read_more_btn:active { background: #000; transition: 0.4s; border: 1px solid #fff; }
.caret { display: none; }
#main { display: none; }

/*menu design work*/

/*loader*/
#preloader { background-color: #000; height: 100%; position: fixed; width: 100%; z-index: 99999900; -webkit-transition-delay: 25s; transition-delay: 25s }
#preloader>img { left: 47%; position: absolute; top: 40%; -webkit-transition-delay: 25s; transition-delay: 25s }
.wrap { text-align: center; vertical-align: middle; box-shadow: 0 40px 60px 20px rgba(0, 0, 0, .2); height: 100%; width: 100%; background: #000; -webkit-transition-delay: 25s; transition-delay: 25s }
.spinner { width: 100px; height: 100px; background-image: url(../img/22.png); position: relative; margin: 50px; display: inline-block; border-radius: 50%; top: 45%; margin: 33px; background-size: 60px auto; background-repeat: no-repeat; background-position: 25px 14px; -webkit-transition-delay: 25s; transition-delay: 25s }
.spinner:after { content: ""; display: block; width: 100px; height: 100px; border-radius: 50%; margin: 2px }
.textlopi { display: inline-block; padding-top: 2.5em; color: #FFCC29; letter-spacing: .1em; height: 60%; width: 500px; border: 0 solid red; margin: auto; margin-left: -190px; margin-top: 80px }
.textlopi center { color: #eee; line-height: 28px; font-family: 'Montserrat', sans-serif; font-size: 20px; margin-top: 0; text-shadow: none; padding: 20px 20px 4px 44px; text-align: center }
.loder { position: absolute; left: 50%; top: 50%; transform: translate(-50%, 50%); }
.is-selected::before { background: #ff0000 !important; content: ""; height: 5px; width: 5px; position: absolute; left: 2px; transition: 0.3s; margin-top: 5px; border-radius: 100px; transform: scale(1.5); }
.is-selected .menu_label { display: block; opacity: 1; }
.menu_nav_animation ul li .is-selected .menu_label { opacity: 1; width: 150px; }
.regu_dtl h2 { color: #fff; text-transform: initial; padding-bottom: 30px; }
.info_dtl h5 { color: #000; margin-bottom: 3px; }
.info_dtl p { font-size: 12px; }
.info_dtl a { color: #ff0000; }
.info_dtl a:hover { color: #ff0000; }
.find_info::after { content: ""; left: -6px; width: 1px; height: 15px; position: absolute; top: 0px; background-color: #fff; }
.find_info { right: 0%; margin-left: 8px; padding: 0px; text-transform: capitalize; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 12px; }
.find_info:hover::after, .find_info:active::after, .find_info:focus::after { width: 1px; }
.border_info { border-top: 1px solid #252525; padding-top: 60px; margin: 0 55px; }
#myModal .modal-body { padding: 30px; }
.modal.in .modal-dialog, .modal.fade .modal-dialog { -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); }
.modal-dialog { left: 0; position: absolute; width: 80%; max-height: 50vh; overflow-y: scroll; top: 50%; transform: translateY(-50%); right: 0; margin: 0 auto; }
.modal-open .modal { background: rgba(27, 27, 27, 0.8); }
.modal-open .modal { overflow-y: hidden; }
.info_dtl p { font-size: 14px; line-height: 26px; }
.info_dtl h6 { font-size: 16px; color: #333; }
.info_dtl ul { list-style: decimal; margin-left: 30px; }
.info_dtl ul li { padding-bottom: 10px; }
.modal-body { position: relative; padding: 30px 50px; }
p.left_content a:hover { cursor: pointer; }
.flderr { color: red; padding-bottom: 20px; }
.contact_data .contact-form .input-block .form-control { padding: 30px 10px 10px; }
div#mailsentsuc { font-size: 20px; display: block; color: green; }
.modal-title { margin-left: 30px; }
#trade-association .team .news_boxs { border: 1px solid #ccc; }
.adress_list p strong { color: #fff; font-weight: 700; }
.services_terms { padding-top: 55px; position: relative; }
.service-banner-txt h1 { font-size: 30px; font-family: 'BrandonGrotesque-Medium'; color: #fff; }
.service-banner-txt p { font-size: 16px; font-family: 'BrandonGrotesque-Light'; color: #fff; line-height: 22px; }
.service-banner-txt { position: absolute; right: 28px; top: 55%; transform: translateY(-50%); }
.white-btn { font-size: 12px; color: #8e041b; text-align: center; text-transform: uppercase; transition: all 0.25s linear; display: inline-block; background: #fff; padding: 12px 30px; }
.white-btn:hover { color: #8e041b; }
.serv-btn { margin-top: 20px; }
.popup_content p { font-family: 'BrandonGrotesque-Light'; font-size: 20px; color: #000000; margin: 0; line-height: 23px; }
.service-list-p { margin-top: 30px; }
.service-list-p p { font-size: 16px; font-family: 'BrandonGrotesque-Light'; color: #231f20; line-height: 20px; }
.service-p .modal-dialog { width: 52%; max-height: initial; overflow-y: hidden; }
.service-list-p .one-p img { width: 60%; }
.service-list-p .one-p { margin-bottom: 25px; }
.service-p .nopadl { padding-left: 0; }
.service-p .close { opacity: 1; outline: none; margin-right: 5px; margin-top: 5px; }
.service-p .modal-content { border-radius: 0; }
.service-p .modal-body { position: relative; padding: 12px 50px; }
.service-p .white-btn { color: #fff; background-color: #8e041b; padding: 9px 38px; }
.service-p .serv-btn { margin: 30px 0; }
.cd-nav-trigger { display: none; }
#banner_frame_one .intro-text { position: absolute; padding: 0; bottom: 60px; padding: 0 15px; }
.intro-one { background: url("../images/images_01.jpg")no-repeat; height: 100vh; background-position: center; background-size: cover; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; }
#banner_frame_one .intro-text { text-align: left; font-family: 'BrandonGrotesque-Medium'; }
.intro-one h1 { font-family: 'BrandonGrotesque-Bold'; color: #fff; font-size: 15px; font-weight: bold; text-transform: uppercase; margin-top: 0; margin-bottom: 10px; letter-spacing: 0.4px; }
.intro-one p { color: #fff; font-size: 30px; font-weight: 300; line-height: 35px; margin: 0 auto; margin-bottom: 50px; font-family: 'BrandonGrotesque-Medium'; letter-spacing: 1px; font-weight: 500; }
ul.white_text { margin-left: 20px; margin-top: 20px; margin-bottom: 20px; }
ul.white_text li { margin-bottom: 10px; list-style: disc; color: #fff; text-transform: initial; font-size: 18px; line-height: 24px; font-family: 'BrandonGrotesque-Light'; font-weight: 300; }
#getting_to_us { background: #fff; padding: 100px 0px; }
.margin_bottom { margin-bottom: 40px; min-height: 100px; }
.parking-image img { margin: 5px auto 0 auto; }
#getting_to_us .heading { color: #ff0000; font-size: 34px; line-height: 30px; font-family: 'BrandonGrotesque-Bold'; padding-bottom: 10px; }
#getting_to_us .description { color: #13224c; text-transform: initial; font-size: 20px; line-height: 30px; font-family: 'BrandonGrotesque-Medium'; font-weight: 300; }

.parentTabs .nav-tabs {
    border-bottom: 1px solid transparent;
}
.parentTabs .nav-tabs li a {
    font-family: 'BrandonGrotesque-Bold';
    text-transform: uppercase;
    cursor: pointer;
    line-height: 20px;
    color: #666;
    font-size: 16px;
    font-weight: 500;
    box-shadow: none;
    border: none;
    border-bottom: 2px solid transparent;
    transition: 0.3s;
    padding: 5px 15px 10px 8px !important;
}
.brek:before {
    content: "|";
    position: absolute;
    left: -6px;
    top: 0px;
    height: 2px;
    width: 10px;
    font-size: 24px;
    color: #666;
}
.parentTabs .nav-tabs li:hover a {
    font-family: 'BrandonGrotesque-Bold';
    text-transform: uppercase;
    cursor: pointer !important;
    line-height: 20px;
    color: #c40303 !important;
    font-weight: 500;
    box-shadow: none;
    border: none !important;
    border-bottom: 2px solid #c40303 !important;
    transition: 0.3s;
    background: none;
}
.parentTabs .nav-tabs > li.active > a, 
.parentTabs .nav-tabs > li.active > a:hover, 
.parentTabs .nav-tabs > li.active > a:focus {
    color: #c40303 !important;
    cursor: default;
    background-color: transparent;
    border: 0px solid transparent;
    border-bottom: 2px solid #c40303 !important;
}
.maintab {
    background: #f1f1f1;
    padding: 20px;
    margin-bottom: 20px;
}
.tab_content_area {
    padding: 40px 50px;
    background: #13224c;
}
.parentTabs .second_tab {
    margin-bottom: 20px;
}
#diversity {
    background: #13224c;
    padding: 100px 0px;
}
#probate {
    background: #13224c;
    padding: 100px 0px;
}
.services_frame p a {
    color: #fff !important;
}

.services_frame ul {
    list-style: disc;
        padding-left: 20px;
}
.services_frame ul li {
    color: #fff;
}
.probate ol li {
    color: #fff;
}

.diversity ul li {
      font-size: 18px;
    line-height: 25px;
    font-family: 'BrandonGrotesque-Light';
    font-weight: 300;
}
.probate ol li {
     font-size: 18px;
    line-height: 25px;
    font-family: 'BrandonGrotesque-Light';
    font-weight: 300;
}
.services_frame ol {
    list-style-type: lower-alpha;
    padding-left: 20px;
}
.services_frame p {
    color: #fff;
    text-transform: initial;
    font-size: 18px;
    line-height: 25px;
    font-family: 'BrandonGrotesque-Light';
    font-weight: 300;
}
.diversity .services_frame {
    width: 90%;
}
/* probate fees section start */

.fees-section {
    display: flex;
    gap: 48px;
    margin: 40px 0;
    align-items: flex-start;
}

.fees-left {
    width: 46%;
}

.fees-title {
    text-align: left;
    font: 500 18px/22px 'BrandonGrotesque-Medium', sans-serif;
    letter-spacing: 0px;
    color: #FFFFFF;
    margin-bottom: 10px;
    text-transform: uppercase;
    margin-top: 0;
}

.fees-left p {
    margin-bottom: 22px;
    text-align: left;
    font: normal normal normal 18px/22px 'BrandonGrotesque-Light';
    letter-spacing: 0px;
    color: #FFFFFF;
}

.fees-box {
    width: 297px;
    border: 1px solid #FF0000;
    padding: 35px 19px;
    align-items: flex-start;
}

.fees-box h4 {
    text-align: center;
    font: 500 18px/22px 'BrandonGrotesque-Medium', sans-serif;
    letter-spacing: 0px;
    color: #FFFFFF;
    margin-bottom: 10px;
}

.fees-box ul {
    padding-left: 18px;
    margin: 0;
}

.fees-box ul li {
    text-align: center;
    font: 500 18px/28px 'BrandonGrotesque-Medium', sans-serif;
    letter-spacing: 0px;
    color: #FFFFFF;    
    list-style: disc;
}

.probate .kajaine-icon h4 {
    width: 110px;
}


/* responsive */

@media only screen and (max-width: 1500px) {

    .fees-section {
        gap: 40px;
    }

    .fees-left {
        width: 52%;
    }

    .fees-box {
        width: 31%;
        padding: 30px 18px;
    }

}

@media only screen and (max-width: 1366px) {

    .fees-section {
        gap: 35px;
    }

    .fees-left {
        width: 58%;
    }

    .fees-box {
        width: 34%;
        padding: 28px 16px;
    }

}

@media only screen and (max-width: 1100px) {

    .fees-section {
        flex-direction: column;
        gap: 30px;
        margin: 30px 0;
    }

    .fees-left,
    .fees-box {
        width: 100%;
    }

    .fees-box {
        padding: 30px 25px;
        max-width: 450px;
    }

    .fees-box h4,
    .fees-box ul li {
        text-align: left;
    }
}

@media only screen and (max-width: 991px) {

    .fees-section {
        flex-direction: column;
        gap: 30px;
        margin: 30px 0;
    }

    .fees-left,
    .fees-box {
        width: 100%;
    }

    .fees-box {
        padding: 30px 25px;
        max-width: 450px;
    }

    .fees-box h4,
    .fees-box ul li {
        text-align: left;
    }

}

@media only screen and (max-width: 767px) {

    .fees-section {
        gap: 20px;
        margin: 25px 0;
    }



    .fees-box {
        padding: 22px 18px;
    }

    .fees-box ul {
        padding-left: 16px;
    }
}


/* probate fees section end */
@media screen and (max-width: 768px) {
.diversity .services_frame {
    width: 100%;
}
}


@media screen and (max-width:480px) {
    .probate .kajaine-icon {
        height: 225px !important;
    }
}