/*
 @Author: Renesis Technologies
 @URL: https://renesistech.com/
 This file contains the styling for the actual theme, this is the file you need to edit to change the look of the theme.
 
 This files contents are outlined below.
 01.	Theme Reset Style
 02.	Global Elements
 03.	Menu
 04.	Social
 05.	Article
 06.	Posts
 07.	Responsive
 08.	Widgets
 09.	Flexslider
 10.	Grid
*/
/* =============================================
			Theme Reset Style					
============================================= */
* {
  margin: 0px;
  padding: 0px;
}

*:after,
*:before {
 margin: 0;
 padding: 0;
}

body {
  color: #666;
  background: #fff;
  font: 400 14px/23px 'Poppins', Arial, Helvetica, sans-serif;
}

body h1,
body h2,
body h3,
body h4,
body h5,
body h6 {
  color: #0f0f0f;
  margin: 0 0 8px;
  font-weight: 400;
  line-height: 1.5;
  font-style: normal;
  text-transform: capitalize;
  font-family: 'Poppins', Arial, Helvetica, sans-serif;
}

h1 {
  font-size: 30px;
}

h2 {
  font-size: 20px;
}

h3 {
  font-size: 16px;
}

h4 {
  font-size: 14px;
}

h5 {
  font-size: 12px;
}

h6 {
  font-size: 10px;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: #0f0f0f;
}

p a {
  -webkit-transition: var(--transition);
  transition: var(--transition);
}

p a,
p a:hover {
  text-decoration: underline;
}

p {
  margin: 0 0 20px;
  line-height: 20px;
  letter-spacing: normal;
}

a {
  text-decoration: none;
  -webkit-transition: var(--transition);
  transition: var(--transition);
}

a:hover, a:focus, a:active {
  outline: none;
  text-decoration: none;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
ul li{
  list-style-type: none;
}

figure {
  margin-bottom: 6px;
  position: relative;
}

img {
  height: auto;
  max-width: 100%;
}

strong {
  color: #414141;
}

iframe {
  width: 100%;
  float: left;
  border: none;
}

button {
  border: none;
}

textarea,
select,
.at-select select,
.form-control,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
  color: #272727;
  outline: none;
  height: 52px;
  width: 100%;
  background: #fff;
  font-size: 14px;
  font-weight: 400;
  -webkit-box-shadow: none;
  box-shadow: none;
  line-height: 18px;
  padding: 16px;
  border-radius: 8px;
  display: inline-block;
  vertical-align: middle;
  border: 1px solid #D9D9D9;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

textarea {
  resize: none;
  height: 150px;
}

.form-control::-webkit-input-placeholder {
  color: #B1B1B1;
}

/* WebKit, Blink, Edge */
.form-control:-moz-placeholder {
  color: #B1B1B1;
}

/* Mozilla Firefox 4 to 18 */
.form-control::-moz-placeholder {
  color: #B1B1B1;
}

/* Mozilla Firefox 19+ */
.form-control:-ms-input-placeholder {
  color: #B1B1B1;
}

/* Internet Explorer 10-11 */
.form-control::-ms-input-placeholder {
  color: #B1B1B1;
}

/* Microsoft Edge */
input:focus,
.select select:focus,
.form-control:focus {
  color: #666;
  border-color: #666;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.form-group {
  width: 100%;
  float: left;
  margin: 0 0 8px;
}

label {
  color: #666;
  display: block;
  font-weight: 400;
  margin-bottom: 10px;
}

form p {
  float: left;
  position: relative;
  width: 100%;
}

form p p span i {
  top: 13px;
  left: 16px;
  color: #474747;
  position: absolute;
}

option {
  padding: 5px 15px;
}

li {
  line-height: 28px;
  list-style: disc inside none;
}

ul ul {
  margin-left: 20px;
}

ol {
  float: none;
  list-style: decimal;
  padding-left: 15px;
}

ol li {
  list-style: decimal;
  width: 100%;
}

ol ol {
  margin-left: 20px;
}

/* =============================================
			Theme Custom Select					
============================================= */
.at-select {
  color: #666;
  float: left;
  width: 100%;
  position: relative;
  text-transform: uppercase;
}

.at-select:after {
  top: 0;
  right: 15px;
  z-index: 2;
  color: #666;
  display: block;
  content: '\e90c';
  line-height: 52px;
  position: absolute;
  text-align: center;
  font-size: inherit;
  pointer-events: none;
  font-family: 'icomoon';
}

.at-select select {
  z-index: 1;
  width: 100%;
  position: relative;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}

.at-select select option {
  color: #666;
}

/* =============================================
		Theme Custom CheckBox Radio				
============================================= */
.at-radio,
.at-radio label,
.at-checkbox,
.at-checkbox label {
  margin: 0;
  width: 100%;
  float: left;
  position: relative;
}

.at-radio label,
.at-checkbox label {
  cursor: pointer;
  display: block;
  padding: 0 0 0 20px;
}

.at-radio input[type=radio],
.at-checkbox input[type=checkbox] {
  display: none;
}

.at-radio input[type=radio] + label:before,
.at-checkbox input[type=checkbox] + label:before {
  top: 4px;
  left: 0;
  color: #373542;
  font-size: 14px;
  line-height: 14px;
  content: '\f096';
  position: absolute;
  font-family: 'FontAwesome';
}

.at-radio input[type=radio] + label:before {
  content: '';
}

.at-radio input[type=radio]:checked + label:before,
.at-checkbox input[type=checkbox]:checked + label:before {
  content: '\f046';
}

/* =============================================
			Theme Global Elements				
============================================= */
.at-haslayout {
  width: 100%;
  float: left;
}

.at-sectionspace {
  padding: 100px 0;
}

.at-locationmap {
  width: 100%;
  float: left;
  height: 500px;
}

.at-btn-sm {
  padding: 0 20px;
  line-height: 30px;
}

.at-btn {
  color: #fff;
  padding: 0 50px;
  position: relative;
  text-align: center;
  background: #272727;
  display: inline-block;
  cursor: pointer;
  border-radius: 10px;
  vertical-align: middle;
  border: 1px solid #272727;
  text-transform: capitalize;
  font: 600 14px/48px 'Poppins', Arial, Helvetica, sans-serif;
}

.at-btn:hover {
  color: #fff;
}

.at-btn-lg {
  width: 100%;
}
.at-btncancel{
  background: none;
  color: #272727;
}
.at-btncancel:hover{
  color: #272727;
}
.at-formtheme {
  width: 100%;
  float: left;
}

.at-formtheme fieldset {
  border: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  float: left;
  position: relative;
}

.at-inputwithicon {
  width: 100%;
  float: left;
  position: relative;
}

.at-inputwithicon span {
  top: 0;
  right: 0;
  z-index: 2;
  width: 50px;
  height: 52px;
  cursor: pointer;
  line-height: 52px;
  position: absolute;
  text-align: center;
}

.at-inputwithicon input {
  z-index: 1;
  padding: 16px 50px 16px 16px;
  position: relative;
}

/*==========================================================================================
		For Mobile Nav use this code in Responsive.css desired Query
==========================================================================================*/
/*==============================================================
		                  Splash Screen start
==============================================================*/
.at-wrapper{
  overflow: hidden;
}
.at-maincontainer{
  /*max-width: 464px;*/
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  display: block;
}
.at-mobileview{
  width: 100%;
  float: left;
}
.at-splashscreen{
  width: 100%;
  float: left;
  height: 100vh;
  display: flex;
  text-align: center;
  align-items: center;
  flex-direction: column;
  gap: 20px;
  justify-content: center;
  background: #586FFF;
}
.at-logo{
  width: auto;
  display: inline-block;
  vertical-align: middle;
}
.at-logo span,
.at-logo span img{
  display: block;
}
.at-logo span img{
  display: block;
  height: auto;
}
.at-splashimg{
  width: auto;
  margin:20px 0;
  display: inline-block;
}
.at-splashimg img{
  width: 100%;
  display: block;
  height: auto;
}
.at-pagetitle{
  width: 100%;
}
.at-pagetitle h4{
  margin: 0;
  color: #fff;
  font-weight: 500;
}
/*==============================================================
		                  Splash Screen end
==============================================================*/
/*==============================================================
		                  Login/Signup Screen start
==============================================================*/
.slider-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 20px;
}

.form-range {
  -webkit-appearance: none;
  width: 100%;
  height: 8px;
  /* background: #B2BDFF; */
  outline: none;
  /* opacity: 0.7; */
  -webkit-transition: .2s;
  transition: opacity .2s;
}

.form-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 24px;
  height: 24px;
  margin: -8px 0 0;
  background: #586FFF;
  cursor: pointer;
  border-radius: 50%;
}

.form-range::-moz-range-thumb {
  width: 24px;
  height: 24px;
  margin: -8px 0 0;
  background: #586FFF;
  cursor: pointer;
  border-radius: 50%; 
}
.label-container{
  width: 100%;
  float: left;
  padding: 10px 0 0;
  position: relative;
}
.label-container span{
  width: auto;
  display: inline-block;
  padding: 4px 16px;
  border-radius: 4px;
  background: #fff;
  color: #272727;
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
}
.label-container span.alfa-b{
  margin-left: 15%;
}
.label-container span.alfa-c{
  margin-left: 30%;
}
.label-container span.alfa-d{
  margin-left: 50%;
}
.label-container span.alfa-e{
  margin-left: 70%;
}
.label-container span.alfa-f{
  margin-left: 90%;
}
.at-mobileholder{
  width: 100%;
  float: left;
}
.at-mobileheaderholder{
  width: 100%;
  float: left;
}
.at-mobileheader{
  width: 100%;
  float: left;
  padding: 16px;
  background: #fff;
}
.at-logomini{
  float: left;
}
.at-logomini a,
.at-logomini a img{display: block;}
.at-logomini a img{
  width: 100%;
  height: auto;
}
.at-countrydropdown{
  float: right;
}
.at-dropdown{
  background: none;
}
.at-btndropdown{
  padding: 0;
  outline: none;
  border: 0;
}
.at-btndropdown:focus{
  border: 0;
  outline: none;
}
.at-btndropdown:after{display: none;}
.at-dropdownmenu{
  border: 0;
  width: 220px;
  padding: 10px;
  border-radius: 10px;
  -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,0.20);
  box-shadow: 0 0 20px 0 rgba(0,0,0,0.20);
}
.at-dropdownmenu li{
  width: 100%;
  float: left;
}
.at-dropdownmenu li a{
  gap: 10px;
  width: 100%;
  display: flex;
  font-size: 14px;
  font-weight: 500;
  color: #272727;
  line-height: 18px;
  padding: 10px 12px;
  border-radius: 4px;
  align-items: center;
}
.at-dropdownmenu li a:hover{background: #D9D9D9;}
.at-signuppagebody{
  width: 100%;
  float: left;
  overflow: auto;
  padding: 60px 16px 32px;
  height: calc(100vh - 64px);
}
.at-signuppagebody::-webkit-scrollbar{display: none;}
.at-pagetitle{
  width: 100%;
  float: left;
  padding: 0 0 32px;
}
.at-pagetitle h1{
  margin: 0;
  color: #272727;
  line-height: 34px;
  font-weight: 500;
  padding: 0 180px 0 0;
}
.at-signupform{
  width: 100%;
  float: left;
}
.at-inputwidthselect{
  width: 100%;
  float: left;
  padding: 16px;
  border-radius: 8px;
  border: 1px solid #D9D9D9; 
}
.at-inputwidthselect .at-select{
  width: 32px;
  float: left;
}
.at-inputwidthselect .at-select select{
  padding: 0;
  border: 0;
  height: auto;
}
.at-inputwidthselect .at-select:after{
  display: none;
}
.at-inputwidthselect input{
  border: 0;
  height: auto;
  width: calc(100% - 32px);
  padding: 0 0 0 10px;
}
.at-alfarangeslider{
  width: 100%;
  float: left;
  padding: 8px 0 40px;
}
.at-rangelslider{
  width: 100%;
  float: left;
  padding: 24px 16px;
  border-radius: 16px;
  background: #EEF1FF;
}
.at-btnholder{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.at-rangelslider label{
  width: 100%;
  float: left;
  text-align: center;
  font-size: 14px;
  color: #272727;
  line-height: 20px;
  font-weight: 500;
  margin: 0 0 24px;
}
.at-formscroll{
  width: 100%;
  float: left;
  /* overflow: auto; */
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  
}
/* .at-formscroll::-webkit-scrollbar{display: none;} */
/*==============================================================
		                  Login/Signup Screen End
==============================================================*/
/*==============================================================
		                  Home Screen start
==============================================================*/
.at-mobileheaderafterlogin .at-countrydropdown{
  float: left;
  padding: 4px 0;
}
.at-headerightarea{
  float: right;
}
.at-notifactionicon{
  float: left;
  margin: 4px 16px 4px 0;
}
.at-profiledropdown{
  float: left;
}
.at-profiledropdown .at-btndropdown{
  width: 32px;
  height: 32px;
  float: left;
  border-radius: 50%;
  text-align: center;
  text-transform: uppercase;
  font-size: 12px;
  line-height: 32px;
  font-weight: 400;
  color: #fff;
  background: #586FFF;
}
.at-namelatter{
  width: 24px;
  height: 24px;
  float: left;
  color: #fff;
  font-size: 10px;
  line-height: 24px;
  text-align: center;
  font-weight: 400;
  font-style: normal;
  border-radius: 50%;
  background: #586FFF;
  text-transform: uppercase;
}
.at-mobilebodywithfooter{
  width: 100%;
  float: left;
  padding: 24px 16px;
  background: #f7f7f7;
  height: calc(100vh - 139px);
}
.at-pagetitle h1 span{font-weight: 400;}
.at-pagesection{
  width: 100%;
  float: left;
  padding: 40px 0 0;
}
.at-pagesection h3{
  margin: 0;
  color: #272727;
  font-weight: 500;
}
.at-description{
  width: 100%;
  float: left;
}
.at-description p{
  margin: 0;
  color: #7D7D7D;
  font-size: 14px;
  line-height: 18px;
  font-weight: 300;
}
.at-pagesection .at-description{
  padding: 4px 0 24px;
}
.at-footermenu{
  width: 100%;
  float: left;
  padding: 16px;
  background:white;
  position: relative;
}
.at-navigation{
  width: 100%;
  float: left;
}
.at-nav{
  width: 100%;
  float: left;
}
.at-nav ul{
  margin: 0;
  padding: 0;
  width: 100%;
  display: flex;
  list-style: none;
  align-items: center;
  justify-content: center;
}
.at-nav ul li{
  width: 25%;
  list-style-type: none;
}
.at-nav ul li a{
  gap: 4px;
  display: flex;
  font-size: 10px;
  color: #676767;
  font-weight: 400;
  line-height: 14px;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

.at-nav ul li a svg path,
.at-nav ul li a svg{fill: #676767;}
.at-nav ul li:last-child a svg path{
  stroke: #676767;
  fill: none;
}
.at-nav ul li a.at-active{
  color: #586FFF;
}
.at-nav ul li a.at-active svg path,
.at-nav ul li a.at-active svg{
  fill: #586FFF;
}
.at-nav ul li:last-child a.at-active svg path{
  stroke: #586FFF;
  fill: none;
}
/*==============================================================
		                  Home Screen end
==============================================================*/
/*==============================================================
		                  Home-contact Screen start
==============================================================*/
.at-mobilebodtxpad{
  padding: 40px 0;
}
.at-mobilebodtxpad .at-pagetitle{
  padding: 0 16px;
}
.at-mobilebodtxpad .at-pagesection{
  padding: 40px 16px 16px;
}
.at-contactcardsholder{
  width: 100%;
  float: left;
  height: calc(100vh - 344px);
  overflow: auto;
}
.at-contactcardsholder::-webkit-scrollbar{display: none;}
.at-cardslist{
  width: 100%;
  float: left;
  background: #fff;
}
.at-cardlistitem{
  width: 100%;
  float: left;
  padding: 16px;
  border-bottom: 1px solid #E0E0E0;
}
.at-cardbody{
  width: 100%;
  float: left;
  padding: 0 0 16px;
}
.at-cardimage{
  width: 85px;
  float: left;
  margin: 0 15px 0 0;
}
.at-cardimage img{
  width: 100%;
  height: auto;
  display: block;
}
.at-cardcontent{
  float: left;
  width: calc(100% - 100px);
}
.at-cardtitlestate{
  width: 100%;
  float: left;
}
.at-cardtitlestate h3{
  float: left;
  margin: 0 8px 0 0;
  font-size: 14ppx;
  line-height: 20px;
  color: #272727;
  font-weight: 500;
}
.at-cardtitlestate span{
  float: left;
  color: #fff;
  font-size: 10px;
  line-height: 12px;
  font-weight: 500;
  padding: 4px 8px;
  border-radius: 4px;
  background: #586FFF;
}
.at-carddetail{
  width: 100%;
  float: left;
}
.at-carddetail li{
  width: 100%;
  float: left;
  padding: 3px 0;
  line-height: inherit;
  list-style-type: none;
}
.at-carddetail li svg{
  width: 16px;
  float: left;
  margin: 0 4px 0 0;
}
.at-carddetail li span{
  float: left;
  color: #272727;
  font-size: 12px;
  line-height: 15px;
  font-weight: 400;
  width: calc(100% - 20px);
}
.at-cardlistitem .at-btn:hover,
.at-cardlistitem .at-btn{
  color: #586FFF;
  border-color: #586FFF;
}
.at-cardcolorgreen .at-cardtitlestate span{background: #00AC26;}
.at-cardcolorgreen .at-carddetail li svg path,
.at-cardcolorgreen .at-carddetail li svg{
  fill: #00AC26;
}
.at-cardcolorgreen .at-carddetail li:last-child svg path{
  stroke: #00AC26;
}
.at-cardcolorgreen .at-btn:hover,
.at-cardcolorgreen .at-btn{
  color: #00AC26;
  border-color: #00AC26;
}
.at-cardcolororange .at-cardtitlestate span{background: #FFA858;}
.at-cardcolororange .at-carddetail li svg path,
.at-cardcolororange .at-carddetail li svg{
  fill: #FFA858;
}
.at-cardcolororange .at-carddetail li:last-child svg path{
  stroke: #FFA858;
}
.at-cardcolororange .at-btn:hover,
.at-cardcolororange .at-btn{
  color: #FFA858;
  border-color: #FFA858;
}
/*==============================================================
		                  Home-contact Screen end
==============================================================*/
/*==============================================================
		                  Home-Default Screen start
==============================================================*/
.at-homedefault .at-pagesection{
  padding: 0 0 16px;
}
.at-homedefault{
  padding: 24px 16px 0;
}
.at-homedefault .at-cardslist{
  background: none;
}
.at-homedefault .at-cardlistitem{
  border: 0;
  padding: 16px;
  margin: 0 0 16px;
  border-radius: 8px;
  background: #E7E9F8;
}
.at-homedefault .at-cardlistitem .at-btn{
  background: #586FFF;
  color: #fff;
}
.at-homedefault .at-cardlistitem .at-btn:hover{color: #fff;}
.at-homedefault .at-cardcolorgreen{
  background: #DEEFE2;
}
.at-homedefault .at-cardcolorgreen .at-btn{
  background: #00AC26;
  color: #fff;
}
.at-homedefault .at-cardcolororange{
  background: #F8EFE7;
}
.at-homedefault .at-cardcolororange .at-btn{
  background: #FFA858;
  color: #fff;
}
.at-homedefault .at-contactcardsholder{
  height: calc(100vh - 230px);
}
.at-cardinnerpage{
  width: 100%;
  float: left;
}
.at-cardinnerpage .at-contactcardsholder{
  height: calc(100vh - 122px);
}
.at-cardinnerheader{
  width: 100%;
  float: left;
  background: #EFF0F7;
  padding: 24px 16px;
}
.at-innerpagetitle{
  float: left;
  width: calc(100% - 100px);
  overflow: inherit;
}
.at-innerpagetitle h1{
  margin: 0;
}
.at-cardinnerheader .at-cardimage{
  float: right;
  margin: 0 0 0 15px;
}
.at-cardinnerpage .at-btn{
  margin: 16px 0 0;
}
.at-cardinnerpage .at-cardbody{
  padding: 16px;
  background: #F7F7F7;
}
.at-cardinnerpage .at-cardlistitem{
  border-radius: 0;
  background: none;
  padding: 0;
}
.at-cardinnerpage .at-cardcolorgreen .at-cardbody{
  background: #F7F7F7;
}
.at-cardinnerpage .at-cardcolorgreen .at-cardinnerheader{
  background: #DFEFE3;
}
.at-cardinnerpage .at-cardcolororange .at-cardbody{
  background: #F7F7F7;
}
.at-cardinnerpage .at-cardcolororange .at-cardinnerheader{
  background: #F7F3EF;
}
.at-innerpagescroll{
  width: 100%;
  float: left;
  overflow: auto;
  height: calc(100vh - 270px);
}
.at-innerpagescroll::-webkit-scrollbar{display: none;}
.at-cardinnerpage .at-cardlistitem .at-btncancel:hover,
.at-cardinnerpage .at-cardlistitem .at-btncancel{
  background: none;
  color: #586FFF;
}
.at-cardinnerpage .at-cardcolorgreen .at-btncancel:hover,
.at-cardinnerpage .at-cardcolorgreen .at-btncancel{
  color: #00AC26;
}
.at-cardinnerpage .at-cardcolororange .at-btncancel:hover,
.at-cardinnerpage .at-cardcolororange .at-btncancel{
  color: #FFA858;
}
/*==============================================================
		                  Home-Default Screen end
==============================================================*/
/*==============================================================
		                  Blogs Screen Start
==============================================================*/
.at-blogmainpage{
  width: 100%;
  float: left;
  overflow: auto;
  height: calc(100vh - 180px);
}
.at-blogmainpage::-webkit-scrollbar{display: none;}
.at-blogcardlist{
  width: 100%;
  float: left;
}
.at-blogcardlistitem{
  width: 100%;
  float: left;
  padding: 0 0 24px;
}
.at-blogimagewithdetail{
  width: 100%;
  float: left;
  background: #E7E9F8;
  border-radius: 8px;
}
.at-blogimage{
  margin: 0;
  width: 100%;
  float: left;
}
.at-blogimage img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 8px 8px 0 0;
}
.at-blogdetail{
  width: 100%;
  float: left;
  padding: 16px;
}
.at-blogdetail h4{
  margin: 0;
  color: #272727;
  font-size: 14px;
  font-weight: 500;
  line-height: 18px;
}
.at-blogdetail span{
  display: block;
  color: #757575;
  font-size: 12px;
  line-height: 15px;
  padding: 8px 0;
  font-style: italic;
  font-weight: 400;
}
.at-blogdetail p{
  margin: 0;
  color: #272727;
  font-size: 12px;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.at-blogdetail a{
  display: block;
  color: #586FFF;
  font-size: 14px;
  line-height: 17px;
  font-weight: 600;
  padding: 8px 0 0;
}
.at-blogaddpage .at-pagesection p{
  margin: 16px 0 24px;
  color: #7D7D7D;
  font-size: 14px;
  line-height: 18px;
  font-weight: 300;
}
.at-mobileheaderinnerpage{
  background: #f7f7f7;
}
.at-mobileheaderinnerpage span{
  float: left;
  width: 24px;
  margin: 0 16px 0 0;
}
.at-mobileheaderinnerpage h2{
  margin: 0;
  line-height: 24px;
  float: left;
  width: calc(100% - 40px);
  color: #272727;
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.at-blogform{
  width: 100%;
  float: left;
}
.at-bg-blue{
  background: #586FFF;
  border-color: #586FFF;
}
.at-filepreview{
  width: 100%;
  float: left;
  /* display: grid;
  clear: both;
  grid-gap: 8px;
  padding: 8px 0 0;
  grid-template-columns: repeat(auto-fill, minmax(56px, 1fr)); */
}
.at-filepreview li{
  width: 56px;
  float: left;
  margin: 8px 8px 0 0;
  position: relative;
}
.at-filepreview li figure{
  margin: 0;
  width: 100%;
  float: left;
  height: 56px;
}
.at-filepreview li figure img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 10px;
}
.at-filepreview li span{
  top: 0;
  right: 0;
  cursor: pointer;
  position: absolute;
}
.at-blogpreviewpage{
  width: 100%;
  float: left;
}
.at-previewitem{
  width: 100%;
  float: left;
  padding: 16px;
  border-bottom: 1px solid #E0E0E0;
}
.at-addblogbtn{
  width: 100%;
  float: left;
  padding: 16px 16px 0;
}
.at-btnholdervtwo{
  flex-direction: row;
}
.at-btnholdervtwo .at-btn{
  border-radius: 40px;
  line-height: 40px;
}
.at-modaldailog{
  max-width: 440px;
  width: 100%;
  padding: 0 15px;
}
.at-modalcontent{
  padding: 24px;
}
/*==============================================================
		                  Blogs Screen end
==============================================================*/
/*==============================================================
		                  Notification Screen Start
==============================================================*/
.at-notifactions{
  padding:12px 0;
}
.at-notipage{
  width: 100%;
  float: left;
  overflow: auto;
  height: calc(100vh - 150px);
}
.at-notipage::-webkit-scrollbar{display: none;}
.at-notisections{
  width: 100%;
  float: left;
  padding: 12px 0;
}
.at-notisections .at-pagesection{
  padding: 0 16px 8px;
}
.at-notisections ul{
  width: 100%;
  float: left;
}
.at-notisections ul li{
  width: 100%;
  float: left;
  list-style-type: none;
  padding: 16px;
  background: #fff;
  border-bottom: 1px solid #F2F2F2;
}
.at-notisections ul li span{
  float: right;
  width: 40px;
  text-align: right;
  color: #8f8f8f;
  font-size: 14px;
  line-height: 18px;
  font-weight: 300;
  }
  .at-notisections ul li p{
    margin: 0;
    float: left;
    width: calc(100% - 40px);
    color: #272727;
    font-size: 14px;
    line-height: 18px;
    font-weight: 300;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.at-supportdetail ul li{
  background: none;
}
.at-supportdetail ul li .at-supportcontact{
  float: left;
}
.at-supportdetail ul li .at-supportcontact p{
  width: 100%;
  color: #b1b1b1;
  font-weight: 400;
  margin: 0 0 5px;
}
.at-supportdetail ul li .at-supportcontact span{  
  display: block;
  width: 100%;
  text-align: left;
  color: #373737;
  font-weight: 400;
}
.at-supportsicon{
  float: right;
}
/*==============================================================
		                  Notification Screen end
==============================================================*/
/*==============================================================
		                  Profile Screen Start
==============================================================*/
.at-profileholder{
  width: 100%;
  float: left;
}
.at-profileusernamerank{
  width: 100%;
  float: left;
}
.at-profileusernamerank > span{
  width: 100px;
  display: block;
  height: 100px;
  color: #fff;
  font-size: 42px;
  font-weight: 400;
  line-height: 100px;
  text-align: center;
  margin: 0 auto 16px;
  border-radius: 16px;
  background: #98A6FC;
  text-transform: uppercase;
}
.at-profileusernamerank h1{
  text-align: center;
  font-weight: 500;
  color: #272727;
  line-height: 34px;
  margin: 0 0 32px;
}
.at-profileusernamerank h1 span{
  display: block;
  font-weight: 400;
}
.at-rankholder{
  width: 100%;
  max-width: 90px;
  display: block;
  margin: 0 auto 16px;
}
.at-rank{
  width: 100%;
  display: flex;
  height: 110px;
  flex-direction: column;
  text-align: center;
  align-items: center;
  justify-content: center;
  background: url(../images/bg.png) no-repeat;
  background-position: center;
  background-size: cover;
}
.at-rank strong{
  color: #586FFF;
  display: block;
  font-size: 40px;
  line-height: 40px;
  font-weight: 900;
  }
.at-rank span{
    color: #586FFF;
    display: block;
    font-size: 10px;
    line-height: 10px;
    font-weight: 900;
}
.at-rankholdertwo .at-rank{
  background: url(../images/bg2.png) no-repeat;
  background-position: center;
  background-size: cover;
}
.at-rankholdertwo .at-rank strong,
.at-rankholdertwo .at-rank span{
  color: #FFA858;
}
.at-rankslide{
  width: 100%;
  float: left;
  padding: 16px;
  border-radius: 16px;
  background: #272727;
}
.at-rankrangeholder{
  width: 100%;
  float: left;
  height: 22px;
  background: #525252;
  border-radius: 50px;
}
.at-rankrange{
  width: 86%;
  float: left;
  height: 22px;
  background: #fff;
  border-radius: 50px;
}
.at-rankrange span{
  float: right;
  color: #272727;
  font-size: 12px;
  line-height: 14px;
  font-weight: 500;
  padding: 4px 16px;
}
.at-rangstartend{
  width: 100%;
  float: left;
  padding: 8px 0 0;
}
.at-rangstartend span{
  float: left;
  color: #fff;
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
}
.at-rangstartend span + span{
  float: right;
}
.at-usercontactinfo{
  width: 100%;
  float: left;
}
.at-usercontactinfo .at-notisections{
  padding: 24px 0;
  margin: 0 0 24px;
  border-bottom: 1px solid #dcdcdc;
}
.at-usercontactinfo .at-notisections ul li{
  padding: 12px 0;
}
.at-usercontactinfo .at-notisections ul li:last-child{border: 0;}
.at-usercontactinfo .at-notisections .at-pagesection{
  padding: 0 0 12px;
}
.at-usercontactinfo .at-btn{
  border-radius: 40px;
  line-height: 42px;
  margin: 12px 0 0;
}
.at-btnred{
  margin: 0 0 24px;
  border-color: #f00;
  color: #f00;
}
.at-btnred:hover{color: #f00;}
.at-userimagedetailmodal{
  width: 100%;
  float: left;
  padding: 0 0 12px;
}
.at-userimagedetailmodal figure{
  width: 126px;
  height: 126px;
  margin: 0 auto 32px;
}
.at-userimagedetailmodal figure img{
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 32px;
  object-fit: cover;
}
.at-userimagedetailmodal ul{
  width: 100%;
  float: left;
}
.at-userimagedetailmodal ul li{
  gap: 10px;
  width: 100%;
  padding: 12px 0;
  display: flex;
  align-items: center;
  border-top: 1px solid #f4f4f4;
}
.at-userimagedetailmodal ul li p{
  margin: 0;
  color: #272727;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
}
/*==============================================================
		                  Profile Screen end
==============================================================*/