
html,*,
body {
    margin: 0;
    font-size: 100%;
     font-family: 'Raleway', sans-serif; box-sizing: border-box;
}

html { color: #202020;
  scroll-behavior: smooth;
}
body a {
    text-decoration: none;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
    font-family: 'Raleway', sans-serif;
}

body img {
    max-width: 100%;
}

a:hover {
    text-decoration: none;
}

input[type="button"],
input[type="submit"],
input[type="text"],
input[type="email"],
input[type="search"] {
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    letter-spacing: 1px;
}
li {
    list-style-type: none;
}
p {
    margin: 0;
    font-size: 1em;
    line-height: 1.9em;
    letter-spacing: 1px;
}

ul {
    margin: 0;
    padding: 0;
}


.container{width:90%; margin: 0px auto;}

.topsec{ display: inline-block; width: 100%; padding: 50px 0; text-align: center;}
.topsec h2{ color: #32B675; font-size: 35px; font-weight: 400;}

.bottomsec{ display: inline-block; width: 100%; background:#F1F1F1; padding: 50px 0;}
.faq_left{ float: left; text-align: right; padding-right:3%; width:28%;}
.faq_right{ float: left; text-align: left; padding-left:4%; width: 72%; border-left: 2px solid #E8E8E8;}

.faq_left .tab{ width: 100%; display: inline-block;}
.faq_left .tab a{ clear: both; display: inline-block; cursor: pointer; margin:0 0 5px 0; color: #313131!important; width: 100%;
padding:15px 50px 15px 20px; border-radius:5px; font-size: 13px; font-weight:600; position: relative;}
.faq_left .tab a span{ background: #fff; color: #32B675; padding: 5px 8px; float: right; line-height: 17px; position: absolute;
right: 10px;top: 15px;border-radius: 13px;}
.faq_left .tab a:hover, .tablinks.active{ color: #fff !important; background: #32B675;}


.tabcontent{ display: inline-block; width: 100%;}
.tabcontent h3{ color:#32B675; font-size: 24px; font-weight:500; margin-bottom:10px; display: inline-block;}



.accordion { background-color: #fff;color: #313131;cursor: pointer; padding:30px 45px 30px 30px; width: 100%; border-radius: 5px; 
    font-size: 15px; margin-top:8px; text-align: left; border: none; outline: none;transition: 0.4s; position: relative;}
.accordion.active{border-radius: 5px 5px 0 0; border-bottom: 1px solid #D6D6D6; font-weight: 600; font-size: 16px; }

.accordion:hover { background: #32B675;}

.panel { border-radius: 0 0 5px 5px;padding:30px;background-color: white;display: none;overflow: hidden;} 
.panel p{ font-size: 15px;    color: #000;} 
.panel p span{ font-weight: bold; margin-right: 10px;} 
.panel p a{ color: #32B675!important;}
.panel p a:hover{ color: #000!important;}


button.accordion::after {float: right; width: 17px; height: 10px; background: url(down.png) no-repeat center center; content: " ";
position: absolute; right:20px; top:35px;}

button.accordion.active::after { background: url(up.png) no-repeat center center;}


@media screen and (max-width: 800px) {
    .topsec {padding: 40px 0;}
    .topsec h2 {font-size: 30px;}
    .faq_left {width: 35%;}
    .faq_right{ width: 65%;}
}

@media screen and (max-width: 767px) {
    .faq_left{ width: 100%; padding: 0;}
    .faq_left .tab a{ text-align: left; width: 100%;}
    .bottomsec{ padding: 30px 0;}
    .faq_right {width: 100%;padding: 20px 0;border-top: 2px solid #E8E8E8;border-left: 0;margin-top: 30px;}
    .tabcontent h3{ font-size: 20px;}
}
@media screen and (min-width: 767px) {
  .faq_left {position: fixed;max-width: 330px;}  
  .faq_right{float: right;}
}