@charset "utf-8";
/* CSS Document */

*{ box-sizing:border-box;}
html{font-smoothing:antialiased;-webkit-font-smoothing:antialiased;-moz-font-smoothing:antialiased; scroll-behavior: smooth;}
body{font:normal 14px/18px "NotoSansTamil", Helvetica, sans-serif; margin: 0; color: #404040;  counter-reset: my-sec-counter;}
.clear{content:".";display:block;clear:both;height:0;visibility:hidden;}
img{max-width:100%;width:auto\9;height:auto;border:0;-ms-interpolation-mode:bicubic; vertical-align: middle;}
p{ margin:5px 0;}

a{ text-decoration:none; color: #2d2d2d;}
i{ color:#6b6b6b; font-size: 16px; vertical-align: middle;}
.icon-author{font-size: 10px;}
ul{ padding: 0; margin:0;}
ul li{ list-style:none;}
h1{ margin:0;}
h2{ margin: 5px 0;}
mark{ background:#fff; }
h1,h2,h3{ font-weight:normal; }

.div-left{ float: left;}
.div-right{ float: right;}

.bg-black{ background: #000000; color: #FFF;}
.bg-dark-grey{ background:#E8E8E8;}

.text-green{ color: #2bab64;}

.btn-auto{background: #2bab64; border:1px solid #2bab64; color: #fff; padding: 5px 8px; height: 25px; border-radius: 4px; display: inline-block; vertical-align: middle; font-size: 14px; transition: 0.3s;}
.btn-auto:hover{ background:#187E46;}

.main-wrapper{ width:1140px; margin: 0 auto;}
.top-panel{ padding:10px;}
.award-txt{ display: inline-block; vertical-align: bottom; text-align: center; margin: 0 5px; font-weight: bold; font-size: 11px; line-height: 12px;}
.award-txt b{ font-size: 22px; line-height: 18px;}

.logo-div,.menu-div{ display:inline-block;}
.icon-menu{ display:none;}

.menu-div{ display: inline-block;}
.menu-div ul li{ display: inline-block; margin:0 10px; position: relative; }
.menu-div ul li a{ position:relative; display: block; padding:10px 0; color: #808080; font-weight: bold;}
.menu-div > .container > ul > li > a > span{ display:inline-block; vertical-align: middle; font:normal 16px '1_TAUNTamil117';}
.menu-div ul li a::before{content: ''; display: block; position:absolute; bottom:-13px; width: 0; height: 3px; background: #FFF; transition: width .3s;}
.menu-div ul li a:hover::before {width: 100%; }
.menu-div ul li a:hover,.menu-div ul li a:hover i{ color:#FFF;}
.mb-menu-fixed{font:normal 16px '1_TAUNTamil117';}
.menu-div ul li i{font-size: 12px;}

.menu-div .sub-menu{ display: none;  position: absolute; top: 52px; left: 0px; z-index: 2; background-color: #fff; min-width: 200px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);font:normal 13px "NotoSansTamil", Helvetica, sans-serif;}
.menu-div ul.sub-menu li a{ padding:10px;}
.menu-div ul.sub-menu li,.sub-menu li a{ display:block; margin: 0;}
.sub-menu li a:hover{background-color: #faf9f1; color: #2d2d2d;}
.menu-div ul li:hover .sub-menu{ display:block;}
.menu-div ul.sub-menu li a:hover{ color:#2d2d2d;}
.menu-div ul li .sub-menu li a::before{ content:none; }

.logo-panel{ margin:10px 0; padding:10px;}
.logo-panel ul{ display:inline-block !important; vertical-align: middle;}
.logo-panel ul:first-of-type{ width:120px; margin: 0 10px 0 0;}
.logo-panel ul:last-of-type{ width:calc( 100% - 150px); padding:0 30px;}
.logo-panel ul li{ text-align:center;}
.logo-panel p{ margin:0;}

.banner-panel{ margin:10px 0;}
.banner-panel .item{ position:relative;}
.banner-panel .banner-cnt{ position:absolute; bottom:50px; right: 30px; color: #FFF; width:240px;}
.banner-panel .banner-cnt h1{font:normal 46px/40px '1_TAUNTamil117';}
.banner-panel .banner-cnt p{ font-size: 12px; line-height: 22px;}

.item-listing{ margin:20px 0;}
.title-div h1{ font-size: 18px; font-weight: bold;}
.title-div i{ font-size: 28px; color: #000;}

.share-div{ background:#C1C1C1; color:#fff; padding:8px 15px 5px 15px; border-radius:30px; float: right; display:inline-block; cursor: pointer;}
.share-div:hover{background:#757272;}
.share-div i{ color:#fff; font-size:16px;}
.share-div span{ font-size:13px;}
.share-div span,.share-div i{ display:inline-block; vertical-align:middle;}

ul.social-icons{display:inline-block; margin:0 5px 0 0;}
ul.social-icons li{ display:inline-block; width:32px; height:32px; line-height:32px; text-align:center; border-radius:50%; background:#C1C1C1; color:#fff; cursor: pointer;}
ul.social-icons li i{color: #fff; font-size: 16px; line-height: 20px;}

ul.social-icons .copy-icon{ background: #2d2d2d;}
ul.social-icons .email-icon{ background: #df503f;}
ul.social-icons .twitter-icon{ background: #00a1ee;}
ul.social-icons .facebook-icon{ background: #5685d2;}
ul.social-icons .whatsapp-icon{ background: #2bab64;}

ul.social-icons .copy-icon:hover{ background: #000;}
ul.social-icons .email-icon:hover{ background: #ca3220;}
ul.social-icons .twitter-icon:hover{ background: #0f8fcc;}
ul.social-icons .facebook-icon:hover{ background: #345995;}
ul.social-icons .whatsapp-icon:hover{ background: #188649;}

ul.motor-list{ }
ul.motor-list li{ display:inline-block;  width:267px; box-shadow:0 0 6px rgba(0,0,0,0.2); margin:10px 6px;}
ul.motor-list li .motor-cnt{ padding:10px;}
ul.motor-list li .motor-cnt h1{font-size: 14px; font-weight: bold;}
ul.motor-list li .motor-cnt p{ margin:10px 0; color: #D0021B;}
ul.motor-list li button{ width:100%; background:#FFF; border:1px solid #B1B1B1; padding: 10px; border-radius: 5px; cursor:pointer;}
ul.motor-list li button:disabled,
ul.motor-list li button[disabled]{ cursor: not-allowed;
  border: 1px solid #999999;
  background-color: #cccccc;
  color: #666666;
}
ul.motor-list li button:disabled:hover,
ul.motor-list li button[disabled]:hover{background-color: #cccccc;   color: #666666;  border: 1px solid #999999;}
ul.motor-list li button:hover{ background:#2bab64; color:#fff; border:1px solid #2bab64;}


.social-media { color: #fff; }
.social-media li { width: 240px; height: 40px; margin: 15px auto;border-radius: 5px;text-align: left;}
.social-media a {padding: 7px 10px 7px 10px;color: #fff; display: block;}
.social-media li i {margin-right: 10px;display: inline-block;}
.facebook {background: #4267b2;}
.facebook i {background: url("../images/facebook@2x.png") no-repeat center center; width: 26px;height: 26px;display: inline-block;background-size: 100%;vertical-align: middle;}
.facebook:hover {background-color: #0041C7;}
.google {background: #ea4335;}
.google i {background: url("../images/google@2x.png") no-repeat center center; width: 26px;height: 26px;display: inline-block;background-size: 100%;vertical-align: middle;}
.google:hover {background-color: #D41200;}
.email {background: #747171;}
.email i {background: url("../images/email@2x.png") no-repeat center center; width: 26px;height: 26px;display: inline-block;background-size: 100%;vertical-align: middle;}
.email:hover {background-color: #212121;}

.popup-section{ position:fixed; top:0; left:0; width:100%; height:100vh; background:rgba(0,0,0,0.5); text-align: center; z-index: 9;}
.popup-div{ background:#fff; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); width: 400px; margin:0 auto; }
.poup-header i{ float:right; margin: 10px; cursor: pointer;}
.popup-content{padding:30px;}
.popup-section .form-fields{ padding:0;}
.popup-section .form-fields input[type='button']{ padding: 14px 0; height: auto;}
.popup-section .form-fields h1{line-height: 24px;}
.popup-section .forgot-pwd{ margin:10px 0; display:block;}






.email {
  background: #747171;
}
.email i {
  background: url("../images/email@2x.png") no-repeat center center;
  background-size: auto;
  width: 26px;
  height: 26px;
  display: inline-block;
  background-size: 100%;
  vertical-align: middle;
}
.email:hover {
  background-color: #212121;
}
.register-later {
  position: absolute;
  padding: 20px 0;
  bottom: 0px;
  left:0px;
  width: 100%;
  text-align: center;
  color: #868686;
}
.register-later:hover {
  background: #F0EFE2;
}
/*form style*/
.forgot-pwd {
  font-size: 10px;
  text-align: right;
}
input:focus ~ label, input:valid ~ label, textarea:valid ~ label {
  font-size: 0.75em;
  color: #909090;
  top: -0.7rem;
  transition: all 0.125s cubic-bezier(0.2, 0, 0.03, 1);
}
.styled-input {
  position: relative;
  width: 100%;
  margin: 15px auto;
}
.styled-input label {
  color: #909090;
  padding: 12px;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.25s cubic-bezier(0.2, 0, 0.03, 1);
  pointer-events: none;
  font-weight:100!important;
}
input {
  width: 100%;
  border-radius: 4px;
  border: solid 1px #b1b1b1;
  background-color: #ffffff;
  padding: 20px 10px 10px 10px;
  color: #2f2f2f;
}
input ~ span {
  display: block;
  width: 0;
  height: 3px;
  background: #8e44ad;
  position: absolute;
  bottom: 0;
  left: 0;
  transition: all 0.125s cubic-bezier(0.2, 0, 0.03, 1);
}
input:focus {
  outline: 0;
}
input:focus ~ span {
  width: 240px;
  transition: all 0.125s cubic-bezier(0.2, 0, 0.03, 1);
}
input[type=button] {
  cursor: pointer;
  border-radius: 4px;
  background-color: #2bab64;
  color: #fff;
  padding: 15px;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 15px;
  border: 0;
}
input[type=submit]:hover {
  background-color: #177b43;
}
input[type=submit] {
  cursor: pointer;
  border-radius: 4px;
  background-color: #2bab64;
  color: #fff;
  padding: 15px;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 15px;
  border: 0;
}
input[type=button]:hover {
  background-color: #177b43;
}
.number-list {
  width: 240px;
  padding: 5px 0;
  border-radius: 4px;
  border: solid 1px #b1b1b1;
  background-color: #ffffff;
}
.styled-input p {
  margin: 5px 0 10px 0;
  line-height: 18px;
}
.number-list input {
  padding: 10px 0;
  text-align: center;
  border: 0;
  margin: 0;
  border-radius: 0;
  color: #000;
  width: 36px;
  background-color: transparent;
  display: inline-block;
  border-right: solid 1px #b1b1b1;
  cursor: pointer;
}
.number-list input:last-of-type {
  border-right: 0;
}











.form-div{ text-align: center; font-family:"NotoSansTamil", Helvetica, sans-serif;}
.form-fields{ padding: 20px 30px;}
.form-fields h2{ line-height: 28px;}
.form-fields input,.form-fields textarea{ border: 1px solid #B1B1B1; padding:20px 15px 10px 15px; border-radius:5px; width:100%;}
.form-fields input[type=checkbox]{ width:auto; vertical-align:middle; }
.form-fields input:focus ~ label, .form-fields input:valid ~ label, .form-fields textarea:valid ~ label {
  font-size: 0.75em;
  color: #909090;
  top: -0.7rem;
  transition: all 0.125s cubic-bezier(0.2, 0, 0.03, 1);
}
.form-fields textarea:focus ~ label, .form-fields textarea:valid ~ label, .form-fields textarea:valid ~ label {
  font-size: 0.75em;
  color: #909090;
  top: -0.7rem;
  transition: all 0.125s cubic-bezier(0.2, 0, 0.03, 1);
}
.form-fields .styled-input {
  position: relative;
  margin: 20px auto;
}
.form-fields .styled-input label {
  color: #909090;
  padding: 15px;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.25s cubic-bezier(0.2, 0, 0.03, 1);
  pointer-events: none;
}
.form-div input[type="submit"]{ padding: 10px 30px; height: auto; cursor: pointer;}
.form-group { display: block; margin: 20px 0; font-size: 14px; }
.form-group input { padding: 0; height: initial; width: initial; margin-bottom: 0; display: none; cursor: pointer;}
.form-group label { position: relative; cursor: pointer;}
.form-group label:before {content:''; -webkit-appearance: none; background-color: transparent; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);  padding: 10px; display: inline-block; position: relative; vertical-align: middle; cursor: pointer; margin-right: 5px; border-radius: 3px; background: #2BAB64;}
.form-group input:checked + label:after {content: ''; display: block; position: absolute;  top: -2px; left: 6px;  width: 5px; height: 10px; border: solid #ffffff; border-width: 0 3px 3px 0; transform: rotate(45deg); border-radius: 3px;}
.number-list { width: 100%;  padding: 5px 0;  border-radius: 4px; border: solid 1px #b1b1b1; background-color: #ffffff; }
.styled-input p { margin: 5px 0 10px 0; line-height: 18px; }
.number-list input { padding: 10px 0; text-align: center; border: 0; margin: 0; border-radius: 0; color: #000; width: calc( 100% / 6 - 5px ); background-color: transparent; display: inline-block;
  border-right: solid 1px #b1b1b1; cursor: pointer;}
.number-list input:last-of-type { border-right: 0; }
.register-later{ margin:20px 0 0  0; padding: 10px 0; display:block; }


