/* Code added by Ramario.................................... */
.policy-section{text-align: center;margin-top: 20px;color: #ffff;}

/* cookie consent styles */
.cookie-container {
  position: fixed;
  bottom: -100%;
  left: 0;
  right: 0;
  background: #fff !important;
  color: hsl(0deg 0% 0%);
  padding: 0 32px;
  box-shadow: 0 -2px 16px rgba(47, 54, 64, 0.39);
  transition: 400ms;
z-index: 9998;
    display: grid;
    grid-template-columns: 1fr;
    width: 500px;
    grid-row-gap: 1em;
    margin-bottom: 19px;
    margin-left: 13px;

    grid-column-gap: 1em;
    padding-top: 31px;
    padding-bottom: 20px;

}
.cookie-col1{margin-bottom: 17px;}
.cookie-col1 p {    position: relative;
    top: 10px;}

.cookie-container.active {
  bottom: 0;
}

.cookie-container a {
    color: rgb(85 156 42);
      text-decoration: underline;
}

.cookie-btn {
    background: #a3bd71;
    border: 0;
    color: #f5f6fa;
    padding: 12px 40px;
    font-size: 14px;
    margin-bottom: 16px;
    border-radius: 0;
    cursor: pointer;
}

.cookie-btn-decline {
    background: #c0c0c0;
    border: 0;
    color: #ffffff;
    padding: 12px 37px;
    font-size: 14px;
    margin-bottom: 16px;
    border-radius: 0;
    cursor: pointer;
}

.readmore-btn {
    background: #2697c2;
    border: 0;
    color: #ffffff;
    padding: 12px 37px;
    font-size: 14px;
    margin-bottom: 16px;
    border-radius: 0;
    cursor: pointer;
}


@media only screen and (max-width: 830px)
{
    .cookie-container
    {
        grid-template-columns: 1fr;
        grid-row-gap: 1em;
        width: 100%;
        margin-left: 0;
    }
}
/* cookie consent style  ends*/

/* Ramarios code ends here............................ */



/* Style the buttons that are used to open and close the accordion panel */
.accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
  background-color: #ccc;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
      padding: 10px 0px 18px;
  background-color: white;
  display: none;
  overflow: hidden;
}

.panel ul li{font-size: 15px !important;}


.popup-overlay
{
	position: absolute;
	width:100%;
	height: 100vh;
	background-color: #00000073;
	z-index: 9999;
	position: fixed;
	display: grid;
	grid-template-columns: 1fr;
	justify-items: center;
}

.popup-overlay.is-active
{
	display: none;
}
.popup-container.is-active
{
	display: none;
}
.popup-container
{
	position: absolute;
	z-index: 99999;
	background-color: #fff;
	padding: 12px;
	top: 30%;
	    border: 8px solid #a3bd71;
}

.popup-heading h2
{
	font-size: 29px;
	color: #6d6d6d;
	text-align: center;
}

.popup-content p
{
	text-align: center;
}
.fa-times-circle
{
	font-size: 29px;
	position: absolute;
	top: -43%;
	left: 47%;
	background-color: #a3bd71;
	padding: 6px;
	color: white;
	border-radius: 23px;
	cursor: pointer;
}

/*Styles For Desktop - 1
====================================================================*/
.error                        {color: red;}
.success                      {color: green;}
body													{}

.sidebar												{background: #dddee0 url(../images/hands.jpg) no-repeat top right; background-size: 100%; text-align: right; width: 23%; padding: 0px; float: left;}
.sidebar ul											{padding-top: 300px; padding-bottom: 95px;}
.sidebar li											{list-style: none;}
.sidebar li a										{display: block; padding: 20px 10px; font-size: 15px; color: #414042;     font-family: 'Belleza', sans-serif; text-decoration: none;}
.sidebar li a:hover								{font-weight: bold;}

.content												{float: left; width: 75%;}

.slider													{min-height: 100px; position: relative; z-index: 8888; float: left; width: 818px; position: relative;}

#app													{position: absolute; right: 0; z-index: 10;}

.logo													{background: url(../images/logo.png) no-repeat center center; position: relative; width: 807px; margin: 20px 0 0 10px;}
.logo ul												{display: block; padding: 0 0 55px 0;}
.logo li													{float: right; list-style: none; width: 26px; height: 24px;}
.logo li a												{display: block;width: 26px; height: 24px;}
.play													{background: url(../images/icons.png) no-repeat -89px;}
.facebook											{background: url(../images/icons.png) no-repeat -59px;}
.linkedin												{background: url(../images/icons.png) no-repeat -30px;}
.email													{background: url(../images/icons.png) no-repeat;}
.blog													{width: 46px !important;}
.blog a													{color: #414042; font-size: 16px; text-decoration: none;}

.content-column											{margin:0 25px 0 40px; width:89% ;    font-family: 'Belleza', sans-serif;}
.content a	{color: #414042; text-decoration:underline;}
.content a:hover		{color: #414042; text-decoration:none;}

.content												{}
.content .name									{width: 807px; text-align: center; font-family: 'Belleza', sans-serif; margin-left: 10px;}
.content .name h1								{font-weight: normal; font-size: 45px; color: #414042; margin-top:20px}
.content .name h2								{font-weight: normal; font-size: 18px; letter-spacing: 8px; color: #414042;}

.content-column img {margin:0 17px 0 11px}

.content										 {font-size: 15px; text-align: justify; color: #414042; line-height: 23px;}

.content img {margin-top:20px}

.content h1										{font-weight: normal; font-size: 26px; color: #414042;font-family: 'Belleza', sans-serif; margin-left:40px}
.content h2										{font-weight: normal; font-size: 22px; color: #414042;font-family: 'Belleza', sans-serif; margin-top:10px; margin-bottom:10px}
.content h3										{font-weight: normal; font-size: 18px; color: #414042;font-family: 'Belleza', sans-serif; margin-top:10px; margin-bottom:10px}
.content ul li									{font-size: 13px; text-align: justify; color: #414042; line-height: 26px; margin-left:30px}
.content ol li									{font-size: 13px; text-align: justify; color: #414042; line-height: 26px; margin-left:45px}
.content ol li ol									{list-style:lower-alpha}
.left														{float: left; width: 42.5%;margin: 0 25px 0 40px;}
.right													{float: left; width: 42.5%;margin: 0 0 0 10px;}
.move                            {margin-left: 40px !important;}
.left p, .right p										{font-size: 13px; text-align: justify; color: #414042; line-height: 26px;}

.footer													{font-size: 12px; text-align: center; color: #fff; background: #414042; padding: 10px 0; margin-top: 35px;}

.footer a	{color: #fff; text-decoration:underline;}
.footer a:hover		{color: #fff; text-decoration:none;}

.mobile												{display: none;}

.form													{font-family: 'Oxygen', sans-serif; color: #58595b; font-size: 14px; margin-bottom: 15px;}
input[type="text"],
input[type="email"],
input[type="number"],
input[type="tel"],
select
											{width: 90%;}
#contact												{width: 90%;}
#email													{width: 90%;}
/*#query													{width: 100%; min-height: 150px; min-width: 100%;}*/
#verif_box											{width: 40%;}
.form-button										{font-family: 'Oxygen', sans-serif; color: #fff; background: #58595b; border: none; font-size: 13px; padding: 5px 15px; margin-top: 15px;}

.contact_details									{margin-top: 15px;}
.contact_details a								{color: inherit;}
.contact_details a:hover					{text-decoration: none;}
.contact_details li								{list-style: none; font-size: 13px; padding: 8px 8px; margin-bottom: 2px; color: #808080;  border-bottom: 1px solid rgba(102,102,102,.2); border-top: 1px solid rgba(102,102,102,.2)}
.contact_details .odd						{background: rgba(102,102,102,.2); font-size: 13px; color: #404040;}
.contact_details .even						{background: rgba(102,102,102,.4); font-size: 13px; color: #404040;}
.italic										{font-style:italic !important}

.testimonial 										{color: #414042 !important; padding: 0; margin: 0 !important; text-align:justify; font-weight:bold}
.testimonials {
  background: rgba(218, 218, 218, 0.26);
  border-left: 10px solid #888888;
  margin: 0;
  padding:3px 7px;
  quotes: "\201C""\201D""\2018""\2019";
  position: relative;
  margin-bottom: 10px;
  margin-top:15px;
}
.testimonials:before {
  color: #888888;
  content: "\201C";
  font-size: 79px;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align:-36px;
}
.testimonials p {
  padding: 0;
  font-size: 15px !important;
  margin:6px 6px;
}

.thumbnails						{width:23%; margin-right: 4px; margin-bottom: 10px; border: 2px solid #414042; padding-right:0px !important; border-radius:3px}

/*Styles Above 1161px - 2
====================================================================*/
@media only screen and (min-width: 960px) and (max-width: 1160px) {

body													{}

.sidebar												{background: #dddee0 url(../images/hands.jpg) no-repeat top right; background-size: 100%; text-align: right; width: 23%; padding: 0px; float: left;}
.sidebar ul											{padding-top: 300px; padding-bottom: 95px;}
.sidebar li											{list-style: none;}
.sidebar li a										{display: block; padding: 10px 10px; font-size: 14px; color: #414042;     font-family: 'Belleza', sans-serif; text-decoration: none;}
.sidebar li a:hover								{font-weight: bold;}

.content												{float: left; width: 75%;}

.slider													{min-height: 100px; position: relative; z-index: 8888; float: left; width: 750px; position: relative;}

#app													{position: absolute; right: 0; z-index: 10; max-width: 3.92%;}

.logo													{background: url(../images/logo.png) no-repeat center center; position: relative; width: 740px; margin: 20px 0 0 10px;}
.logo ul												{display: block; padding: 0 0 55px 0;}
.logo li													{float: right; list-style: none; width: 26px; height: 24px;}
.logo li a												{display: block;width: 26px; height: 24px;}
.play													{background: url(../images/icons.png) no-repeat -89px;}
.facebook											{background: url(../images/icons.png) no-repeat -59px;}
.linkedin												{background: url(../images/icons.png) no-repeat -30px;}
.email													{background: url(../images/icons.png) no-repeat;}
.blog													{width: 46px !important;}
.blog a													{color: #414042; font-size: 16px; text-decoration: none;}

.content												{ font-size:15px;}
.content .name									{width: 740px; text-align: center; font-family: 'Belleza', sans-serif; margin-left: 10px;}
.content .name h1								{font-weight: normal; font-size: 45px; color: #414042;}
.content .name h2								{font-weight: normal; font-size: 18px; letter-spacing: 8px; color: #414042;}

.left														{float: left; width: 46%;margin: 0 25px 0 15px;}
.right													{float: left; width: 46%;margin: 0 0 0 10px;}

.left p, .right p										{font-size: 13px; text-align: justify; color: #414042; line-height: 26px;}

.footer													{font-size: 12px; text-align: center; color: #fff; background: #414042; padding: 10px 0; margin-top: 35px;}

}


/*Styles Above 768px - 2
====================================================================*/
@media only screen and (min-width: 768px) and (max-width: 959px) {

body													{}

.sidebar												{background: #dddee0 url(../images/hands.jpg) no-repeat top right; background-size: 100%; text-align: right; width: 23%; padding: 0px; float: left;}
.sidebar ul											{padding-top: 100px; padding-bottom: 95px;}
.sidebar li											{list-style: none;}
.sidebar li a										{display: block; padding: 10px 10px; font-size: 14px; color: #414042;     font-family: 'Belleza', sans-serif; text-decoration: none;}
.sidebar li a:hover								{font-weight: bold;}

.content												{float: left; width: 75%; font-size:15px;}

.slider													{min-height: 100px; position: relative; z-index: 8888; float: left; width: 577px; position: relative;}

#app													{position: absolute; right: 0; z-index: 10; max-width: 3.92%;}

.logo													{background: url(../images/logo.png) no-repeat center center; position: relative; width: 577px; margin: 20px 0 0 10px;}
.logo ul												{display: block; padding: 0 0 55px 0;}
.logo li													{float: right; list-style: none; width: 26px; height: 24px;}
.logo li a												{display: block;width: 26px; height: 24px;}
.play													{background: url(../images/icons.png) no-repeat -89px;}
.facebook											{background: url(../images/icons.png) no-repeat -59px;}
.linkedin												{background: url(../images/icons.png) no-repeat -30px;}
.email													{background: url(../images/icons.png) no-repeat;}
.blog													{width: 46px !important;}
.blog a													{color: #414042; font-size: 16px; text-decoration: none;}

.content												{}
.content .name									{width: 577px; text-align: center; font-family: 'Belleza', sans-serif; margin-left: 10px;}
.content .name h1								{font-weight: normal; font-size: 45px; color: #414042;}
.content .name h2								{font-weight: normal; font-size: 18px; letter-spacing: 8px; color: #414042;}

.left														{float: left; width: 45%;margin: 0 25px 0 15px;}
.right													{float: left; width: 45%;margin: 0 0 0 10px;}

.left p, .right p										{font-size: 13px; text-align: justify; color: #414042; line-height: 26px;}

.footer													{font-size: 11px; text-align: center; color: #fff; background: #414042; padding: 10px 0; margin-top: 35px;}

}


/*Styles for 767px - For Tablet in Potrait Mode
====================================================================*/
@media only screen and (max-width: 767px) {

.table		{width: 100%; overflow-x: scroll; overflow-y: hidden;}

}


/*Styles for Smartphones - 3
====================================================================*/
@media only screen and (min-width: 480px) and (max-width: 767px) {

body													{}

.sidebar												{display: none;}
.sidebar ul											{padding-top: 100px; padding-bottom: 95px;}
.sidebar li											{list-style: none;}
.sidebar li a										{display: block; padding: 10px 10px; font-size: 14px; color: #414042;     font-family: 'Belleza', sans-serif; text-decoration: none;}
.sidebar li a:hover								{font-weight: bold;}

.content												{float: left; width: 100%;}

.slider													{min-height: 100px; position: relative; z-index: 8888; float: left; width: 100%; position: relative;}

#app													{position: absolute; right: 0; z-index: 10; max-width: 3.92%;}

.logo													{background: url(../images/logo.png) no-repeat center center; position: relative; width: 100%; margin: 20px 0 0 10px;}
.logo ul												{display: block; padding: 0 0 55px 0;}
.logo li													{float: right; list-style: none; width: 26px; height: 24px;}
.logo li a												{display: block;width: 26px; height: 24px;}
.play													{background: url(../images/icons.png) no-repeat -89px;}
.facebook											{background: url(../images/icons.png) no-repeat -59px;}
.linkedin												{background: url(../images/icons.png) no-repeat -30px;}
.email													{background: url(../images/icons.png) no-repeat;}
.blog													{width: 46px !important;}
.blog a													{color: #414042; font-size: 16px; text-decoration: none;}

.content												{ font-size:15px;}
.content .name									{width: 100%; text-align: center; font-family: 'Belleza', sans-serif; margin-left: 10px;}
.content .name h1								{font-weight: normal; font-size: 45px; color: #414042;}
.content .name h2								{font-weight: normal; font-size: 18px; letter-spacing: 8px; color: #414042;}

.left														{float: left; width: 45%;margin: 0 25px 0 15px;}
.right													{float: left; width: 45%;margin: 0 0 0 10px;}

.left p, .right p										{font-size: 13px; text-align: justify; color: #414042; line-height: 26px;}

.footer													{font-size: 11px; text-align: center; color: #fff; background: #414042; padding: 10px 0; margin-top: 35px;}

.mobile												{display: block;}

}


/*Styles for Smartphones - 4
====================================================================*/
@media only screen and (max-width: 480px) {

body													{}

.sidebar												{display: none;}
.sidebar ul											{padding-top: 100px; padding-bottom: 95px;}
.sidebar li											{list-style: none;}
.sidebar li a										{display: block; padding: 10px 10px; font-size: 14px; color: #414042;     font-family: 'Belleza', sans-serif; text-decoration: none;}
.sidebar li a:hover								{font-weight: bold;}

.content												{float: left; width: 100%; font-size:15px;}

.slider													{min-height: 100px; position: relative; z-index: 8888; float: left; width: 100%; position: relative;}

#app													{position: absolute; right: 0; z-index: 10; max-width: 3.92%;}

.logo													{background: url(../images/logo.png) no-repeat center center; position: relative; width: 100%; margin: 20px 0 0 10px;}
.logo ul												{display: block; padding: 0 0 55px 0;}
.logo li													{float: right; list-style: none; width: 26px; height: 24px;}
.logo li a												{display: block;width: 26px; height: 24px;}
.play													{background: url(../images/icons.png) no-repeat -89px;}
.facebook											{background: url(../images/icons.png) no-repeat -59px;}
.linkedin												{background: url(../images/icons.png) no-repeat -30px;}
.email													{background: url(../images/icons.png) no-repeat;}
.blog													{width: 46px !important;}
.blog a													{color: #414042; font-size: 16px; text-decoration: none;}

.content												{}
.content .name									{width: 100%; text-align: center; font-family: 'Belleza', sans-serif; margin-left: 10px;}
.content .name h1								{font-weight: normal; font-size: 45px; color: #414042;}
.content .name h2								{font-weight: normal; font-size: 18px; letter-spacing: 8px; color: #414042;}

.left														{float: left; width: 100%; margin: 0;}
.right													{float: left; width: 100%; margin: 0;}

.left p, .right p										{font-size: 13px; text-align: justify; color: #414042; line-height: 26px;}

.footer													{font-size: 11px; text-align: center; color: #fff; background: #414042; padding: 10px 0; margin-top: 35px;}

.mobile												{display: block;}

}