@charset "UTF-8";
/*
Theme Name: Chapin & Russell Associates
Author: Webdesign 309
Author URI: http://www.webdesign309.com/
Description: We are a full service webdesign and development company delivering high end design and development solution for our clients and delivering best solutions to attract more visibility and customization to your website.
Version: 3.0.0
Tags: peoria web development, chicago web development, custom wordpress development, advertising agency solutions, florida webdesign, chicago webdesign, illinois webdesign, custom webdesign development
*/



:root{
    --body-color: #333333;
    --header: rgb(0, 0, 0); 
    --black-color:rgba(0, 0, 0, 1);
    --btn-color:#00BEA8;
    --primary-color:#009385;
    --secondary-color: #FFA843;
    --tertiary-color: '#AEFDE5';
    --white-color:#FFFFFF;
    --bg-color:#f2f2f2;


    --body-font: 'Helvetica Neue', sans-serif;
    --heading-font: 'Noto Sans Display', sans-serif;
    --faq-font: 'Avenir', sans-serif;
    --input-font: 'Poppins', sans-serif;
    --helvetica-bold-font: 'Helvetica Neue', sans-serif;
    --btn-font: 'Noto Sans Display', sans-serif;
    --avenir-book-font: 'Avenir', sans-serif;
    --noto_black: 'Noto Sans Display', sans-serif;
}


/* ::selection{
color: var(--body-color);
background-color: var(--white-color);
} */
/* 1. Create a Clean Base
------------------------------------------------------------------------------*/

html, body, br, hr, div, span, a, object, iframe, ul, ol, dl, li, dt, dd, h1, h2, h3, h4, h5, h6, p, blockquote, q, address,
small, big, cite, dfn, ins, del, i, em, b, strong, sup, sub, strike, pre, code, samp, kbd, var, tt, form, fieldset, legend, label,input, textarea, option, .nobox 
{background: transparent; border: 0; font-size: 100%; margin: 0; outline: 0; padding: 0; vertical-align: baseline;}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main {display: block;}

blockquote, q {quotes: none;}
br {height: 0;}
ul, ol, dl, li {margin:0; padding:0; list-style-type: none;}
ul, ol {margin:0 0 0 0px;}
html, body{ border:none; -webkit-text-size-adjust:none;}


/* 2. Define Base Typography
------------------------------------------------------------------------------*/
body{padding: 0;margin: 0; font-family: var(--body-font); font-size: 20px; color: var(--body-color); line-height: 24px; box-sizing: border-box; overflow-x: hidden;}
*, *:after, *:before {box-sizing: border-box;}

svg path{ transition: all 0.3s; }

/* Create the Default Headers  */
h1, h2, h3, h4, h5, h6 {margin: 0; font-weight: normal;color: var(--body-color); line-height:1.2; font-family: var(--heading-font);}

/* Specific Header Settings */
h1,.h1 {font-size:60px;}
h2,.h2 {font-size:40px; line-height: 55px;}
h3,.h3 {font-size:30px;}
h4,.h4 {font-size:26px;}
h5,.h5 {font-size: 22px;}
h6,.h6 {font-size: 20px;}

/* Create the Default Paragraphs */
p {margin-bottom: 25px; }

/* Other Typo */
strong {font-weight: bold;}
hr {border:0 #000 solid; border-top-width: 1px; clear: both; height: 0;}
ol {list-style: decimal;}
ul {list-style: disc;}

/* 3. Images
------------------------------------------------------------------------------*/

/* Remove border around linked images */
img {max-width: 100%; border: 0; border-style: none;}

/* 4. Links
------------------------------------------------------------------------------*/

/* Default Link Types */
a {text-decoration:none;transition: 0.5s; display: inline-block; color:var(--primary-color); }

a:hover{color: #333333;}
/* 5. Forms
------------------------------------------------------------------------------*/
.button, a.button, button, html input[type="button"], input[type="reset"], input[type="submit"] { font-family: var(--btn-font);  font-weight: normal; margin: 0 0 0 0;  padding: 6px 19px 7px 16px;  border-radius:20px; background-color:var(--btn-color); border: 2px solid var(--white-color); display: inline-block; vertical-align: middle;  font-size: 20px; color: var(--white-color); line-height: 27px; position: relative;outline: none;box-shadow: none;text-align: center;text-decoration: none;-webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; overflow: hidden; position: relative;z-index: 0;}

.button.button-border, a.button.button-border, button.button-border, html input[type="button"].button-border, input[type="reset"].button-border, input[type="submit"].button-border {background-color: var(--white-color); color:var(--white-color); border: 1px solid var(--btn-color);}

.button.button-border::after, a.button.button-border::after{border-radius:0; content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-color: var(--primary-color); z-index: -2; transition: all .35s}
.button.button-border:hover:after, a.button.button-border:hover:after{width: 0%;}

.button:hover, a.button:hover, button:hover, html input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { outline:2px solid var(--secondary-color) ; border-color: var(--white-color); background-color: var(--primary-color); color: var(--white-color); }

input[type="search"], input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"], textarea {padding:9px 25px 10px 20px; font-family: var(--input-font);  font-size: 18px; background-color:#fff; letter-spacing: 0; width: 100%; color:var(--body-color); text-transform: none; filter: alpha(opacity=100); border: 1px solid var(--secondary-color);border-radius: 8px; -webkit-border-radius: 8; -moz-border-radius:8px; line-height:27px; box-shadow: none;-webkit-box-shadow: none;-moz-box-shadow: none; outline: none !important; width: 100%;-webkit-appearance: none;-moz-appearance: none;appearance: none; resize: none;}

input::-webkit-input-placeholder {color:  #333333; opacity:0.3;} 
input:-moz-placeholder {color: #333333;  opacity:0.3;} 
input::-moz-placeholder {color:  #333333;  opacity:0.3; } 
input:-ms-input-placeholder {color:  #333333; opacity:0.3} 
textarea::-webkit-input-placeholder {color:  #333333;  opacity:0.3; } 
textarea:-moz-placeholder {color: #333333;  opacity:0.3; } 
textarea::-moz-placeholder {color:  #333333;  opacity:0.3; } 
textarea:-ms-input-placeholder {color:  #333333; opacity:0.3 }

/* Removes fieldset borders. even on Opea 7 */
fieldset {border: 1px solid transparent;}

textarea{ min-height: 120px; }

/* Default ul li css*/
ul.col-2 li:before, ul.col-3 li:before{ position: absolute; content: ""; width: 8px; height: 8px; background-color: var(--body-color); top: 15px; left: 0; border-radius: 50%; }
ul.col-2 li { width: 50%; line-height: 1.2;}
ul.col-3 li { width: 33.33%; }
ul.col-2, ul.col-3 { overflow: hidden;display: flex;flex-wrap: wrap; padding-bottom: 15px;}


/* 6. Tables
------------------------------------------------------------------------------*/

/* Table Fixes */
table {border-spacing: 0; border-collapse: collapse;}
td {text-align: right; font-weight: normal;}

/* 7. Framework
------------------------------------------------------------------------------*/
/* container */
.header_container{max-width: 1574px; width: 100%; padding-left: 50px; padding-right: 50px; margin: 0 auto;}

.container{max-width: 1469px; width: 100%; padding-left: 50px; padding-right: 50px; margin: 0 auto;}

.row{display: flex;flex-wrap: wrap; margin-left: -15px; margin-right: -15px;}
.col_12,.col_11,.col_10,.col_9,.col_8,.col_7,.col_6,.col_5,.col_4,.col_3,.col_2,.col_1{position: relative; padding-right: 15px; padding-left: 15px; }

.col_4 {max-width: 35%;}
.col_6{max-width: 65%;}
.col_3 {max-width: 33.33%;}
.col_2 {max-width: 50%;}
.col_1 {max-width: 100%;}

.col2 { max-width: 50%; width: 100%; }
.col1 { max-width: 100%; width: 100%; }

.d-flex{ display:flex;}
.flex-wrap{flex-wrap:wrap;}
.justify-content-start{justify-content:flex-start;}
.justify-content-center{justify-content:center;}
.justify-content-end{justify-content:flex-end;}
.justify-content-between{justify-content:space-between;}
.align-items-start{align-items: flex-start;}
.align-items-center{align-items: center;}
.align-items-end{align-items: flex-end;}
.row-reverse{flex-direction: row-reverse;}
.text-center{text-align: center;}
.text-left{text-align: left;}
.text-right{text-align: right;}
.font-light {font-weight: 300;}
.table {width: 100%;}
.common_color{ color: var(--primary-color); }
.mt-20{margin-top: 20px;}

/* def-page */ 
.def-page{padding: 60px 0;}
.def-page .right-img{float:right; margin:0 0 15px 40px; position: relative; z-index: 0; line-height: 0;}
.def-page .left-img{float:left; margin:0 40px 15px 0; position: relative; line-height: 0;}
.def-page .right-img img{border-radius: 8px; position: relative; width: 100% ; height: auto;}
.def-page .left-img img{border-radius: 8px; position: relative; width: 100% ; height: auto;}
.def-page h2, .def-page h3, .def-page h4, .def-page h5, .def-page h6 { margin: 0 0 15px 0; padding: 0px;  }

.def-page h1{ font-size: 60px; line-height: 70px; } 
.def-page h2{ font-size: 40PX; line-height: 50px;}
.def-page h3{ font-size: 30px; line-height: 40px; } 
.def-page h4{ font-size: 26px; line-height: 36px;}
.def-page h5{ font-size: 22px; line-height: 32px;}
.def-page h6{font-size: 20px; line-height: 30px;}

.def-page ul {margin: 0; padding-bottom: 15px; overflow: hidden; padding-left: 0;}
.def-page ul li {text-align: left; list-style: none;  color: var(--body-color); position: relative; padding: 6px 15px 6px 20px;}
.def-page ul li:before {content: ''; position: absolute; left: 0; top: 15px; width: 8px; height: 8px; background-color: var(--second-primary-color); border-radius: 50%;  }
.def-page ol{padding-left: 0; padding-bottom: 15px;}
.def-page ol li {list-style-type:none;counter-increment:item; color: var(--body-color); padding: 5px 0; }
.def-page ol li:before {display:inline-block; content: counter(item) ".";  color: var(--body-color);  padding-right:10px;}
.def-page ul.col-2, .def-page ul.col-3 { overflow: hidden }
.def-page ul.col-2 li{width: 50%;float: left;}
.def-page ul.col-3 li {width: 33.33%;float: left;}
.privacy-page ol { margin-bottom: 25px;}
.privacy-page ol>li:before { padding-right: 05px;}
.privacy-page .privacy-inner{ padding-left: 30px; margin-bottom: 20px;}
.privacy-page .privacy-inner ul{ margin-top: 05px; }
.privacy-page ul,.privacy-page ol{ margin-left:20px;}
.privacy-page ol li{padding: 5px 0px;}
.pagenotfound {width: 100%;display: block; padding: 70px 0px 80px; text-align: center;}
.pagenotfound h2 {font-size: 40px;}
/* .pagenotfound p{font-size: 18px;} */
.thankyou {text-align: center;}
.thankyou h3 strong {font-size: 34px;}
.clearfix:after { clear: both; display: block; visibility: hidden; content: ""; }
.fl{float:left}.fr{float:right}.cl,.clear,.clr,.social_share{clear:both}.clearfix:after{clear:both;display:block;visibility:hidden;content:""}
.def-page a { color: var(--second-primary-color); display: inline; }
.def-page a:hover{ color:var(--body-color); }

.header_otr{position: relative; padding: 14px 0; display: flex;  justify-content: space-between; width: 100%;}
.header_logo { max-width: 250px; }
.header_otr nav {display: flex;  align-items: center;}

.header_menu ul li a{color: var(--body-color); font-size: 20px; line-height: 25px; font-family: var(--helvetica-bold-font);}

.header_menu ul li a:hover{color: var(--primary-color);}

.header_menu ul{gap: 68px;}

header{ position: fixed; top: 0; left: 0; width: 100%; z-index: 9; background-color: var(--white-color);}


.header_btns .button{ display:flex; align-items:center; justify-content:center; width:46px; height:46px; border:2px solid var(--white-color); border-radius:30px; background: var(--btn-color); overflow:hidden; transition:all .4s ease; text-decoration:none; white-space:nowrap; outline: 2px solid var(--body-color);}

.header_btns{ display: flex; flex-direction: column; gap: 13.5px;}

.header_btn_otr{    position: absolute; min-width: 159px; display:flex; gap:13px; flex-direction: column; top: 0; right: 0; }

.header_btns .button span{
    width:20px;
    height:20px;
    display:block;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    flex-shrink:0;
}

.header_btns .button.call span{
    background-image:url('images/phone-call.png');
}

.header_btns .button.user span{
    background-image:url('images/user.png');
}

.header_btns .button em{font-size: 18px; line-height: 24px; font-family: var(--noto_black); max-width:0; overflow:hidden; margin-left:0; color:#fff; }

.header_btns .button:hover{ width:159px; background:#2c8b7f; padding-left: 10px; }

.header_btns .button:hover em{ max-width:100px; margin-left:10px; }

.header_btns .button:hover span{ filter:brightness(0) invert(1); }

.banner_sec{ position:relative; width:100%; height: 100dvh; display: flex; align-items: flex-end; padding-bottom: 114px; overflow: hidden; }

.banner_img{position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: -1;}

.banner_img img{ width:100%; display:block; }

.banner_sec::before{ content:''; position:absolute; left:0; top:0; width:100%; height:100%; z-index:0; pointer-events:none; background:linear-gradient( to bottom, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.25) 30%, rgba(255,255,255,0.60) 65%, rgba(255,255,255,0.90) 100% ); }

.banner_sec::after,.guiding_you::after{ content:''; position:absolute; left:50%; bottom:42px; /* adjust karo */ transform:translateX(-50%); width:120px; height:3px; background: var(--secondary-color); border-radius:10px; z-index:3; }
.banner_content,.guiding_you{position: relative;}

.banner_content h1{font-size: 159px; line-height: 191px; font-family: "shelby", sans-serif; font-weight: 400; font-style: normal; color: var(--primary-color); }

.banner_boxes{ display:flex; justify-content:space-between; align-items:center; }

.banner_box .icon{ transition: transform .3s ease-out; transform-origin:center center; }

.banner_box:hover .icon{ transform: rotate(-7deg) scale(1.05); }

.banner_box{ display:inline-block; vertical-align:middle; width:280px; padding:13px 20px; background:#fff; border:1px solid var(--secondary-color); border-radius:8px; text-align:left; text-decoration:none; box-shadow: 0px 3px 6px #00000027; transition:.3s; }

.banner_box .icon img{ width:100%; }

.banner_boxes .banner_box_inr{display: flex; gap: 15px; color: var(--black-color); justify-content: center; align-items: center;}

.banner_boxes .banner_box div.text{font-family: var(--helvetica-bold-font); width: 100%; max-width: 58%;}

.banner_box .icon{width: 82px; height: 82px;}

.banner_box .icon img{width: 100%; height: 100%;}

.guiding_you h2{color: var(--secondary-color); padding-bottom: 32px;}

.guiding_you{padding: 22px 0 0; text-align: center; background-color: #fff;}

.guiding_otr{display: flex; gap: 29px;}

.guiding_text{max-width: 69%; width: 100%; text-align: left;}

.guiding_img{line-height: 0; max-width:31%; width: 100%; border-radius: 8px; overflow: hidden; }

.guiding_img img{box-shadow: 0px 3px 6px #00000026;}

.guiding_btn{padding: 55px 0 48px 0; display: flex; justify-content: space-around;}

.guiding_you::after{bottom: 0;}

.area{padding: 23px 0 8px 0; background-color: #fff; box-shadow: 0px 3px 6px #00000052;}

.area h2{color: var(--primary-color); padding-bottom: 18px; text-align: center;}

.area_inr{ flex-wrap: wrap; gap: 10px 0; margin: 0 -5px; justify-content: center;}

.area_item{  width: 100%; padding: 0 5px;}

.area_box{ position: relative; overflow: hidden; border: 1px solid transparent;}

.area_box::before{ content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: 0.6; transition: opacity .5s cubic-bezier(0.4, 0, 0.2, 1); background: linear-gradient( to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,.8) 25%, rgba(255,255,255,0) 55%, rgba(255,255,255,0) 100% ); }

.area_box:hover::before{ opacity: 1; }

.area_img{ line-height: 0; overflow: hidden; height: 318px; }

.area_img img{object-position: top; width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(0.4, 0, 0.2, 1); }

.area_box:hover .area_img img{ transform: scale(1.05); }

.area_content{ position: absolute; top: 20px; left: 50%; transform: translateX(-50%); width: 100%; text-align: center; z-index: 3; opacity: 1; transition: .3s ease; }

.area_content h3{ font-family: var(--helvetica-bold-font); }

.home main{ background-image: url(images/banner.webp); background-size: cover; background-position: center; background-attachment: fixed; }

.area ul{ margin: 25px 0; padding-left: 100px; list-style: disc; }

.area ul li{ list-style-type: disc; margin-bottom: 5px; color: var(--body-color); text-align: left; }

.area ul li::marker{ color: var(--body-color); font-size: 22px; }

.area_content ul { opacity: 0; transition: 0.3s all ease-in-out; }

.area_box:hover{border: 1px solid var(--secondary-color);}

.area_box:hover .area_content ul { opacity: 1; }

.area_box:hover::before{background-color:  rgba(255,255,255,0.65);}

.main_difference{ background-color: rgba(255, 255, 255, 0.3);; padding: 75px 82px 65px 82px;}

.the_difference{background: rgba(0, 147, 133, 0.8); border-radius: 8px; padding: 51px 0;}

.the_difference h2{color: #AEFDE5; padding-bottom: 23px;}

.the_difference p,.the_difference p strong{color: #fff;}

.the_difference_inr p strong{font-family: var(--helvetica-bold-font); display: block; margin: 30px 0;}

.common_ul ul {margin: 0;padding-bottom: 10px;}
.common_ul ul li { list-style: none; color: var(--white-color); text-align: left; position: relative; padding: 5px 0 30px 34px;overflow: hidden;}
.common_ul ul li:before { content: "";  width: 22px; height: 22px; top: 7px; left: 0;    background-image: url(images/tick.png); background-position: center; background-repeat: no-repeat; background-size: contain; position: absolute;   background-color: transparent; }
.common_ul ul.col-2, .common_ul ul.col-3 { overflow: hidden }
.common_ul ul.col-2 li {width: 50%;float: left; text-align: left;}
.common_ul ul.col-3 li {width: 33.33%;float: left; text-align: left;}

.main_difference.common_ul ul{margin-top: 30px;}


.faq { padding: 40px 0 70px; overflow: hidden; background-color: #fff; box-shadow: 0px -3px 6px #00000029;}

.faq h2 { text-align: center; padding: 0 0 48px; color: var(--primary-color);}

.faq > * { position: relative; z-index: 1; }

.faq-container { position: relative; display: flex; flex-wrap: wrap; justify-content: center; gap: 20px 16px; }

.accordion-item { max-width: 49%; width: 100%; overflow: hidden; transition: 0.7s ease-in-out; height: min-content; border-radius: 20px; background: #FFFFFF; border: 2px solid var(--secondary-color); }

.accordion-header { position: relative; font-family: var(--faq-font); transition: 0.3s all; cursor: pointer; opacity: 1; padding: 7px 28px; text-align: center; color: var(--primary-color);font-weight: 900;}

.accordion-content { padding: 0px 20px; max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }

.accordion-content .content-section p { margin-bottom: 15px; }

.accordion-header::before { content: ""; position: absolute; right: 18px; top: 20px; width: 10px; height: 10px; border-right: 3px solid var(--primary-color); border-bottom: 3px solid var(--primary-color); transform: translateY(-60%) rotate(45deg); transition: transform 0.3s ease; }

.accordion-item.active .accordion-header::before { transform: translateY(-40%) rotate(-135deg); }

.we_were {padding: 39px 0 37px 0; background-color: #E3F1F0; box-shadow: 0px 3px 6px #00000053;}

.we_were h2{color: var(--primary-color); padding-bottom: 44px; text-align: center;}


.we_were_in{gap: 29px;}
.we_were_in .we_were_text{max-width: 64%; width: 100%; gap: 39px;}
/* .home_contact_in .home_contact_text .home_contact_img{} */
.we_were_in .we_were_text .we_were_right{flex: 1; text-align: justify;}
.we_were_in .we_were_form{max-width: 36%; width: 100%;}
.we_were_form form , form { margin: -5px; display: flex; flex-wrap: wrap; }

.input_fild { padding: 5px; }

footer { padding: 29px 0 31px; }
footer ul li::before{display: none;}
footer ul li{padding: 0;}
footer ul{padding: 0;}
footer .footer_logo {width: 315px; margin: 0 auto 10px; line-height: 0; }
.footer_logo a img{width: 315px; height: 100%;}
/* footer .footer_logo img{filter: drop-shadow(0px 3px 6px #000000);} */
.footer_in { padding-bottom: 38px; gap: 220px;}
.footer_in .footer_in_left { max-width: 60%; width: 100%; gap: 64px; }
.footer_in .footer_in_left .footer_in_left_venu { max-width: 37%; width: 100%; }
 .footer_in_left_time { max-width: 50%; width: 100%; }
.footer_in_left_venu ul li a, .footer_in_left_venu ul li label { flex: 1; }
.footer_in_left_venu ul li span img { width: 100%; height: 100%; object-fit: cover; }
.footer_in_left_time ul li>strong { font-family: var(--avenir_black); display: block; }
footer ul li, footer ul li a { color: var(--body_color); font-size: 18px; line-height: 30px; }
.footer_in .footer_in_left .footer_in_left_venu ul li { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 10px;}
.footer_in_left_venu ul li span { line-height: 0; width: 29px; height: 29px; display: block; }
.footer_in_left_venu ul li span img { width: 100%; height: 100%; object-fit: cover; }
.footer_in .footer_in_right { max-width: 30%; width: 100%; text-align: left; justify-items: end; justify-content: space-between; }
/* .footer_in_right ul { gap: 0px 40px; flex-wrap: wrap; width: 73%; justify-content: end; }
.footer_in_right ul li { max-width: 40%; width: 100%; text-transform: uppercase;}
.footer_in_right ul li a:hover { color: var(--primary_color); } */
.footer_in_left_venu ul li a:hover { color: var(--primary_color); }
.footer_copy{text-align: center; line-height: 30px;}
.footer_copy p{ margin-bottom: 0;}

.footer_in_left h6,.footer_in_right h6{color: var(--primary-color); font-family: var(--faq-font); padding-bottom: 5px;font-weight: 900;}

.footer_in_right {gap: 61px;}

.footer_in_left_venu h6{margin-left: 35px;}

.footer_in_left_venu ul li{font-family: var(--avenir-book-font); color: #000;}

.footer_in_left_venu ul li a:hover,.footer_in_right ul li a:hover{color: var(--primary-color);}

.footer_in_left_time ul li strong{ color: #000; text-transform: capitalize;}

.footer_in_left_time ul li{font-family: var(--avenir-book-font); color: #000;}

.footer_in_right .service{max-width: 37%; width: 100%;}

.footer_in_right ul li a{font-family: var(--avenir-book-font); color: #000; line-height: 30px;}