/*



  Theme Name: Flexis



  	Template URI: http://www.themeelite.com/



	Description: Full Screen Design Agency Template



	Author: Themeelite



	Author URI: http://www.themeelite.com



	License: GNU General Public License version 3.0



	License URI: http://www.gnu.org/licenses/gpl-3.0.html



	Version: 1.0x




  	0. Root style


 
  	1. Body style



	2. Headings



	3. Header



		3.1 Menu Style



	4. About Home page



	5. Service Details + Area of Exper/tise Home page



	6. Fun-Facts



	7. Latest Project



	8. Testimonial



	9. Logoes Silde



		9.1 . OWL Compons 



	10. Let's start a project



	11. Footer



	12. Header Inner Banner



	13. About Pan 



	14. The History



	15. The Team



	16. Our expertise



	17. Works



	18. Services



	19. Blog



	20. Contact



	21. 404 Page



	22. Commingsoon Page



	23. Clean.css Embedd



	24. Datepicker Styles

  

*/

/* ===========================



   ======= 0. Root style ======== 



   =========================== */

:root {
  --min-font: 10;
  --max-font: 20;
  --space-around: 2%;
  --space-in: 4vh;
  --space-out: 2%;
  --space-top: 9vh;
  --space-around: 2%;
  --logo-def: url('../images/logo.png');
  --logo-inv: url('../images/logo-hover.png');
  --no-txt-deco: none;
  --navbar-height: 8vh;
  --nav-h: var(--space-top);
  --teal: #20c997;
  --cyan: #17a2b8;
  --white: #fff;
  --gray: #6c757d;
  --gray-dark: #2d2d2d;
  --dim-gray: #696969; 
  --txt-col: var(--gray-dark);
  --milk-white: #FEFCFF;
  --white: #ffffff;
  --txt-col-light: var(--milk-white);
  --title-font: 'Marcellus SC';
  --subtitle-font: 'Cormorant SC';
  --p-font: 'Cormorant Garamond';

}

/* ===========================



   ======= 1. Body style ======== 



   =========================== */

* {
	padding: 0;
	margin: 0;
}
body {
	font-family: var(--p-font);
	font-size: 14px;
	line-height: 18px;
	color: #4e4a4f;
	background-color: #FFF;
	font-weight: 400;
  max-width: 100vw;
}
body, img {
 transition: all .2s linear;
 -o-transition: all .2s linear;
 -moz-transition: all .2s linear;
 -webkit-transition: all .2s linear;
}
a:focus, img:focus, button:focus, .btn:focus {
	outline: none;
}
a {
	text-decoration: none;
	outline: none;
	color: #010101;
	transition-delay: 0s;
	transition-duration: 0.6s;
	transition-property: all;
	transition-timing-function: ease;
}
html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
img {
	display: block;
	border: none;
	max-width: 100%;
  border-radius: 3px;
	height: auto;
	font-size: 0;
	line-height: 0;
	padding: 0;
	margin: 0;
  vertical-align: middle;
}
button, html input[type="button"],/* 1 */ input[type="reset"], input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
 *overflow:visible;
}

p { 
  font-family: var(--p-font)!important;
  letter-spacing: 1px!important; 
  font-size: calc(12px + (22 - 12) * ((100vw - 300px) / (1600 - 300)));
  line-height: calc(1.3em + (1.5 - 1.2) * ((100vw - 300px)/(1600 - 300)));
  margin: auto;
  width: fit-content;
  font-weight: 400;
  /*line-height: 1.3em;*/
      /* Set max and min font sizes    
      --max-font: 20;
      --min-font: 8;                
      font-size: 100%;             */
}

p strong {
  font-family: var(--title-font);
  font-weight: 900;
}
.lead, .btn-fog {
  font-family: var(--subtitle-font)!important;
}   
td {
	text-align: left;
	vertical-align: top;
}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video, input, main {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	border: 0;
	outline: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, img, main {
	display: block
}
audio, canvas, video {
	display: inline-block;
 *display:inline;
 *zoom:1;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
.clear {
	clear: both;
	line-height: 0;
	height: 0;
}
.center-block {
  display: block;
  margin-right: auto;
  margin-left: auto;
  float: none;
  margin: 0 auto;
}


::-moz-selection {
 background:#4d4d4d;
 color:#fff;
 text-shadow:none;
}

::selection {
 background: #4d4d4d;
 color: #fff;
 text-shadow: none;
}

/* ===========================



   ========= 2. Headings ======== 



   =========================== */



h1 {
	font-family: var(--title-font);
	font-size: 30px;
	line-height: 32px;
	font-weight: 400;
}
@media (min-width: 1200px) {
  h1 {  
    --max-font: 30;
    --min-font: 14;
    font-size: calc(var(--max-font) * 1px); 
  }
}

h2 {
	font-family: var(--title-font);
	font-size: var(--responsive);
	line-height: 1.2em;
	font-weight: 400;
	letter-spacing: 2px;
	--min-font: 10;
	--max-font: 30;
}
h3 { 
  font-family: var(--title-font);
  font-size: 3em;
  line-height: 1.2em;
  font-weight: 700;
  margin-top: calc((1.5rem - 1.25rem) + 1.5rem*2);
  color: var(--txt-col);
}
h4 {
  text-transform: capitalize;
  font-variant: small-caps;
  font-family: var(--title-font);
  line-height:3em;
  font-size: 2em;
  font-weight: 600;
}
h4.text-center { 
  font-family: var(--title-font);
  font-size: 1.2em; 
  line-height: 1.6em; 
  text-transform: none; 
  font-variant: none; 
  font-weight: 300; 
}
h4 strong { font-weight: 600; }        
h5 {
	font-family: var(--p-font);
	font-size: 16px;
	line-height: 18px;
	font-weight: 400;
}
@media screen and (min-width: 992px) { 
  h5.lead { font-size: 3em; text-align: right; }
}

h6 {
  font-family: var(--title-font);
  font-size: 1.3em;
  line-height: 18px;
  font-weight: 400;
  margin-top: var(--space-around);
  text-transform: uppercase;
}


@media (max-width: 461px) {
  h1 {  
    --max-font: 20;  
    --min-font: 14;  
    font-size: calc(var(--min-font) * 1px); 
  }
  .vopo > h5 {
    text-align: left; 
  }
}
@media screen and (min-width: 461px) and (max-width: 769px) { 
  .vopo > h5 { 
    text-align: center; 
  }
}      

/* ===========================



========= 3. Header ======== 



=========================== */



.header {
	position: relative;
	width: 100%;
}
.header .header_v1 figure {
	text-align: center;
}
.header .header_v1 figure figcaption {
	text-transform: uppercase;
	position: relative;
	z-index: 60;
	padding-top: 20%;
}
.header .header_v1 figure figcaption h2 {
	color: #FFF;
	font-family: var(--title-font);
	font-weight: 300;
	font-size: 8vh;
	line-height: initial;
	padding: 3vh;
}
.header .header_v1 figure figcaption p {
	font-size: 12px;
	font-family: var(--title-font);
	line-height: 14px;
	color: #8d8d8d;
	letter-spacing: 3px;
	padding-top: 12px;
}
.header .header_v1 .bg_overlay {
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
	right: 0;
	top: 0;
	background-color: rgba(0, 0, 0, .8)
}
.header .static-header figure figcaption {
	text-transform: uppercase;
	position: absolute;
	z-index: 60;
	left: 0;
	right: 0;
	text-align: center;
	margin-top: 250px;
	top: 0;
	padding: 0;
}
.header .header_v1 figure.video-header {
	position: relative
}
.header .header_v1 figure.video-header .figcaption {
	left: 0;
	padding-top: 13%;
	position: absolute;
	right: 0;
	top: 0;
	text-transform: uppercase;
	z-index: 60;
}
.header .header_v1 figure.video-header .figcaption h2 {
    color: #FFF;
    font-weight: 700;
    font-size: 53px;
    line-height: 54px;
    letter-spacing: 22px;
}
.header .header_v1 figure.video-header .figcaption p {
    font-size: 12px;
    line-height: 14px;
    color: #8d8d8d;
    letter-spacing: 3px;
    padding-top: 12px;
}
#home-image img {
	height: 600px !important;
	width: 100% !important;
}
.video-section .pattern-overlay {
	background-color: rgba(71, 71, 71, 0.59);
	padding: 110px 0 32px;
	min-height: 650px;
}
.video-section .buttonBar {
	display:none;
}
.player {
	font-size:1px;
}
/* ===========================



 =========  3.1 Menu Style ======== 



 =========================== */
.active {
	text-decoration: underline;
}

.stuck {
	border-bottom: 1px solid lightgrey;

}
.header .navbar {
	position: absolute;
	left: 0;
	right: 0;
	transition-delay: 0s;
	transition-duration: 0.6s;
	transition-property: all;
	transition-timing-function: ease;
}
.header .navbar.stuck {
	position: fixed;
	top: 0;
	width: 100%;
	left: 0;
	right: 0;
	padding-top: 0;
	background-color: #FFF;
	min-height: 79px;
}
.header h1 {
	position: relative;
	float: left;
	margin-top: 44px;
	transition-delay: 0s;
	transition-duration: 0.6s;
	transition-property: all;
	transition-timing-function: ease;
	z-index: 10;
}
.header h1 img {
	transition-delay: 0s;
	transition-duration: 0.6s;
	transition-property: all;
	transition-timing-function: ease;
}
.header h1 .logo_hove {
	display: none;
}
.header .navbar.stuck h1 .logo {
	display: none;
}
.header .navbar.stuck h1 {
	margin-top: 20px;
}
.header .navbar.stuck h1 .logo_hove {
	display: block;
}
.header nav {
	float: right;
	position: relative;
}
.header nav #menu-button {
	width: 28px;
	font-size: 0;
	float: right;
	height: 18px;
	position: relative;
	margin-top: 51px;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
 -webkit-transition: .5s ease-in-out;
 -moz-transition: .5s ease-in-out;
 -o-transition: .5s ease-in-out;
 transition: .5s ease-in-out;
	cursor: pointer;
}
.header .navbar.stuck nav #menu-button {
	margin-top: 30px;
}
.header nav #menu-button span {
	display: block;
	position: absolute;
	z-index: 60;
	height: 3px;
	width: 100%;
	background: #FFF;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
 -webkit-transition: .25s ease-in-out;
 -moz-transition: .25s ease-in-out;
 -o-transition: .25s ease-in-out;
 transition: .25s ease-in-out;
}
.header .navbar.stuck nav #menu-button span {
	background: #010101;
}
 .header nav #menu-button span:nth-child(1) {
 top: 0px;
}
 .header nav #menu-button span:nth-child(2) {
 top: 7px;
}
 .header nav #menu-button span:nth-child(3) {
 top: 14px;
}
 .header nav #menu-button.open span:nth-child(1) {
 top: 10px;
 -webkit-transform: rotate(135deg);
 -moz-transform: rotate(135deg);
 -o-transform: rotate(135deg);
 transform: rotate(135deg);
}
 .header nav #menu-button.open span:nth-child(2) {
 opacity: 0;
 left: -60px;
}
 .header nav #menu-button.open span:nth-child(3) {
 top: 10px;
 -webkit-transform: rotate(-135deg);
 -moz-transform: rotate(-135deg);
 -o-transform: rotate(-135deg);
 transform: rotate(-135deg);
}
.header nav ul {
	position: absolute;
	right: 24.5%;
	top: 0;
	margin-top: 20px;
	transition-delay: 0s;
	transition-duration: 0.1s;
	transition-property: all;
	transition-timing-function: ease;
}
.header .navbar.stuck nav ul {
	margin-top: 0;
}
.header nav ul > li {
	display: inline-block;
	text-transform: uppercase;
	font-size: 15px;
	padding-left: 35px;
	font-weight: 600;
	letter-spacing: 2px;
	position: relative;
}
.header nav ul > li > a {
	color: #FFF;
	line-height: 79px;
	display: block;
}
.header .navbar.stuck nav ul > li > a {
	color: #010101;
}
<!--
.header nav ul > li:hover ul {
	display: block;
}
-->
.header nav ul > li ul {
	position: absolute;
	right: 0;
	top: 45px;
	border: 2px solid #4d4d4d;
	width: 203px;
	padding-left: 24px;
	padding-right: 26px;
	display: none;
	background-color: #4e4a4f !important;
}
.header .navbar.stuck nav ul li ul {
	border-color: #FFF;
	top: 77px;
}
.header .navbar.stuck nav ul li ul li a {
	color: #FFF;
}
.header nav ul > li ul li {
	padding-left: 0;
	font-size: 13px;
}
.header nav ul > li ul li a {
	line-height: 4px;
	padding-bottom: 15px
}
.header .angle-down {
	position: absolute;
	background-image: url("../images/down_arrow.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 13px;
	height: 103px;
	left: 50%;
	bottom: 50px;
	display: inline-block;
	margin-left: -12px;
	z-index: 999;
	-webkit-animation: bounce 2000ms infinite;
	-moz-animation: bounce 2000ms infinite;
	-o-animation: bounce 2000ms infinite;
	-ms-animation: bounce 2000ms infinite;
	animation: bounce 2000ms infinite;
}
/* ===========================



========= 4. About Home page ======== 



=========================== */



.about_pan_home {
	background-color: #f0f0f0;
	text-align: center;
	padding-top: 106px;
	padding-bottom: 120px;
}
.about_pan_home p {
	font-weight: 300;
	font-size: 24px;
	line-height: 39px;
	text-align: center;
	color: #130e14;
	font-family: var(--p-font);
	letter-spacing: 1px;
	margin: 0 7vw;
}
.about_pan_home a {
	font-size: 13px;
	font-weight: bold;
	line-height: 49px;
	display: inline-block;
	text-transform: uppercase;
	color: #000;
	width: 178px;
	letter-spacing: 6px;
	background-color: transparent;
	margin-top: 47px;
	border: 1px solid #000;
	font-family: var(--title-font);
}
.about_pan_home a:hover {
	background-color: #000;
	color: #fff;
	font-weight: bold;
}

.mpb-pack {
	font-size: 13px;
	font-weight: bold;
	line-height: 49px;
	display: inline-block;
	text-transform: uppercase;
	color: #000;
	width: 35vw;
	letter-spacing: 3px;
	background-color: transparent;
	margin-top: 47px;
	border: 1px solid #000;
	font-family: var(--title-font);
	/*font-size: calc(12px + (14 - 12) * ((100vw - 300px) / (1600 - 300)))!important;*/
	/*line-height: calc(1.3em + (1.5 - 1.2) * ((100vw - 300px)/(1600 - 300)))!important;  */
}
.mpb-pack:hover {
	background-color: #000;
	color: #fff;
	font-weight: bold;
}
/* ===========================



========= 5. Service Details + Area of Exper/tise Home page ======== 



=========================== */



.services-area-home {
	padding-top: 105px;
	padding-bottom: 116px;
}
.service_details p {
	font-weight: 300;
	font-size: 21px;
	line-height: 37px;
	padding-bottom: 41px;
	color: #555;
	letter-spacing: 3px;
}
.service_details p + p {
	font-size: 16px;
	line-height: 23px;
	padding-bottom: 35px;
	letter-spacing: 1px;
	font-weight: 400;
}
.service_details .button-service {
	display: inline-block;
	font-size: 12px;
	line-height: 49px;
	display: inline-block;
	text-transform: uppercase;
	color: #FFF;
	width: 226px;
	letter-spacing: 6px;
	background-color: #000;
	text-align: center;
}
.services-area-home aside {
	padding-left: 56px;
}
.services-area-home aside h6 {
	font-size: 13px;
	line-height: 15px;
	text-transform: uppercase;
	font-weight: 900;
	color: #000;
	letter-spacing: 6px;
}
.services-area-home aside ul {
	padding: 0;
	margin: 0;
	list-style: none;
	margin-top: 33px;
}
.services-area-home aside ul li {
	font-size: 16px;
	line-height: 16px;
	font-weight: 300;
	color: #555;
	padding-left: 21px;
	position: relative;
	margin-bottom: 14px;
	letter-spacing: 1px;
}
.services-area-home aside ul li:before {
	content: "";
	background-color: #130e14;
	display: inline-block;
	width: 5px;
	height: 1px;
	position: absolute;
	left: 0;
	top: 8px;
}
/* ===========================



========= 6. Fun-Facts ======== 



=========================== */



.fun-facts {
	padding-top: 113px;
	padding-bottom: 146px;
}
.fun-facts .happy-us {
	padding-left: 55px;
}
.fun-facts h3 {
	font-size: 63px;
	line-height: 64px;
	font-weight: 900;
	color: #FFF;
	display: block;
	padding-bottom: 13px;
}
.fun-facts span {
	font-family: var(--p-font);
	display: block;
	text-transform: uppercase;
	color: #FFF;
	font-size: 15px;
	line-height: 16px;
	font-weight: 300;
}
/* ===========================



========= 7. Latest Project ======== 



=========================== */



.latest-projects-pan {
	padding-top: 0;
}
.latest-projects-top header h3 {
	font-size: 32px;
	line-height: 2em;
  text-transform: capitalize;
	color: #130e14;
	font-weight: 700;
	font-family: var(--p-font);
	padding-bottom: 6px;
}
.latest-projects-top header h6 {
	font-family: var(--subtitle-font);
	font-size: 20px;
	line-height: 14px;
	text-transform: uppercase;
	color: #232024;
	letter-spacing: 5px;
  font-variant: small-caps;
}
.latest-projects-top ul {
	text-align: right;
	padding-top: 15px;
}
.latest-projects-top > ul {
  text-align: right;
  padding-top: 15px;
}
.latest-projects-top ul > li {
	display: inline-block;
	cursor: pointer;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 13px;
	line-height: 18px;
	color: #000;
	letter-spacing: 4px;
	background-image: url(../images/devider.jpg);
	background-position: 0 4px;
	background-repeat: no-repeat;
	padding-left: 18px;
	padding-right: 18px;
}
.latest-projects-top > ul > li {
  display: inline-block;
  cursor: pointer;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 13px;
  line-height: 18px;
  color: #000;
  letter-spacing: 4px;
  background-image: url(../images/devider.jpg);
  background-position: 0 4px;
  background-repeat: no-repeat;
  padding-left: 18px;
  padding-right: 18px;
}
.latest-projects-top ul > li:last-child {
	padding-right: 0;
}
.latest-projects-top ul > li:first-child {
	padding-left: 0;
	background-image: none
}
.latest-projects-top ul > li.active {
	color: #89878a;
}
.projects-images {
	padding-top: 59px;
	font-family: var(--title-font);
}
.projects-images ul {
	text-align: center;
}
#Grid .mix {
	display: none;
	opacity: 0;
}
 .no-gutter [class*=col-] {
 padding-right: 0;
 padding-left: 0;
}
.projects-images ul li {
	-moz-box-shadow: 0 0 0 1px #fff;
	-webkit-box-shadow: 0 0 0 1px #fff;
	box-shadow: 0 0 0 1px #fff;
	overflow: hidden;
	position: relative;
  list-style: none;
}
.projects-images ul li a {
	overflow: hidden;
}
.projects-images ul li .figcaption {
	background: rgba(255, 244, 69, 0.7);
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	width: 100%;
	-moz-transition: opacity, 0.3s;
	-o-transition: opacity, 0.3s;
	-webkit-transition: opacity, 0.3s;
	transition: opacity, 0.3s;
}
.projects-images ul li section {
	position: absolute;
	text-align: center;
	top: 50%;
	width: 100%;
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.projects-images ul li h5, .projects-images ul li p, .projects-images ul li img {
	-moz-transition: all, 0.5s;
	-o-transition: all, 0.5s;
	-webkit-transition: all, 0.5s;
	transition: all, 0.5s;
}
.projects-images ul li h5, .projects-images ul li p {
	color: #181818;
	margin: 0;
	opacity: 0;
}
.projects-images ul li h5 {
margin-top: 15px;
	margin-bottom: 15px;
	-moz-transform: translate3d(0, -200%, 0);
	-ms-transform: translate3d(0, -200%, 0);
	-webkit-transform: translate3d(0, -200%, 0);
	transform: translate3d(0, -200%, 0);
}
.projects-images ul li p {
	-moz-transform: translate3d(0, 200%, 0);
	-ms-transform: translate3d(0, 200%, 0);
	-webkit-transform: translate3d(0, 200%, 0);
	transform: translate3d(0, 200%, 0);
}
.projects-images ul li a:hover img {
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}
.projects-images ul li a:hover .figcaption, .view_button:hover {
	opacity: 1;
  background-color: rgba(0,0,0,0.3);
  color: #fefefe;
  border-radius: 2px;
  transition: all, 1.5s;
}
.projects-images > ul li a:hover .figcaption, .logoes-pan .figcaption { 
  /*background-color: #000;*/
  opacity: 1; 
}
.projects-images ul li:hover .figcaption h5, .projects-images ul li:hover .figcaption p {
	opacity: 1;
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	color: #fff;
	float: none;
	margin: 0 auto;
}
.view_button {
	text-transform: uppercase;
	font-size: 13px;
	line-height: 21px;
	display: block;
	margin: 70px auto;
	text-align: center;
	color: #232024;
	letter-spacing: 6px;
	width: 300px;
	border-left: 2px solid #a3a4ab;
	border-right: 2px solid #a3a4ab;
	margin-bottom: 48px;
}
.view_button:hover {
	background-color: #c9cacb;
}

@media (max-width: 769px) {

  .projects-images > ul li {
    width: 96%;
    margin: 0 auto;
  }                                                  
  .projects-images > ul li img {                                              
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    display: block;      
  }                                                                                                                                            
  .service_details p, .fun-facts, .latest-projects-pan, .latest-projects-top section > ul { 
    text-align: center; 
  }
  .footer, .testimonial_pan, .fun-facts { 
    padding: 40px 0; 
  }
}

@media (min-width: 481px) and (max-width: 991px) {
  .projects-images > ul li {
    width: 26vw;
    margin: 0 2% 0 2%;
    float: none;
  }
  .projects-images > ul li img {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    display: block;
  }
}
/* ===========================



========= 8. Testimonial ======== 



=========================== */



.testimonial_pan {
	background-color: #f0f0f0;
	padding-bottom: 80px;
}
.testimonial_pan article p {
	font-weight: 300;
	font-size: 16px;
	line-height: 24px;
	letter-spacing:2px;
	padding-bottom: 30px;
}
.testimonial_pan article h6 {
	font-family: var(--title-font);
	text-transform: uppercase;
	font-weight: 600;
	font-size: 14px;
	line-height: 14px;
	letter-spacing: 5px;
	color: #130e14;
	border-bottom: 1px solid #a3a4ab;
	display: inline-block;
	padding-bottom: 20px;
}
.testimonial_pan .owl-controls .owl-pagination {
	text-align: center;
	padding-top: 28px;
}
.testimonial_pan .owl-controls .owl-pagination .owl-page {
	display: inline-block;
	background-color: #b7b7b7;
	width: 12px;
	height: 11px;
	border-radius: 100%;
	margin: 0 4px;
}
.testimonial_pan .owl-controls .owl-pagination .owl-page.active {
	background-color: #130e14;
}
/* ===========================



========= 9. Logoes Silde ======== 



=========================== */



.logoes-pan {
	position: relative;
	padding-top: 48px;
	padding-bottom: 53px;
}
.logoes-pan .figcaption {
  opacity: 1; 
}
.logoes-pan ul {
	margin: 0 auto;
	padding: 0 10%;
}
.logoes-pan ul li {
	display: inline-block;
	margin: 0 10px;
	text-align: center;
}
.logoes-pan ul li img {
	margin: 0 auto;
	display: block;
}
.logoes-pan .owl-buttons div {
	font-size: 0;
	line-height: 0;
	position: absolute;
	top: 40%;
	cursor: pointer;
	width: 68px;
	height: 13px;
	background-position: 0 0;
	background-repeat: no-repeat;
}
.logoes-pan .owl-buttons div.owl-prev {
	left: 0;
	background-image: url(../images/prev.png);
}
.logoes-pan .owl-buttons div.owl-next {
	right: 0;
	background-image: url(../images/next.png);
}

@media (max-width: 769px) {
    .logoes-pan > ul { padding: 0; }      
    .logoes-pan > ul li { margin: 0; }
}
.logo_hove, .center-block {
  align-items: center!important;
  float: none!important;
  margin: 0 auto!important;
}
/* ===========================



========= 9.1 . OWL Compons ======== 



=========================== */


.owl-carousel .owl-wrapper:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.owl-carousel {
    display: none;
    position: relative;
    width: 100%;
    -ms-touch-action: pan-y;
}

.owl-carousel .owl-wrapper {
    display: none;
    position: relative;
    -webkit-transform: translate3d(0px, 0px, 0px);
}

.owl-carousel .owl-wrapper-outer {

    overflow: hidden;
    position: relative;
    width: 100%;
}

.owl-carousel .owl-item { float: left; }

.owl-controls .owl-page, .owl-controls .owl-buttons div { cursor: pointer; }

.owl-controls {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.owl-carousel .owl-wrapper, 
.owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
}


/* ===========================



========= 10 . Let's start a project ======== 



=========================== */



.letsproject-pan {
	background-color: #fff445;
	text-align: center;
}
.letsproject-pan a {
	text-transform: uppercase;
	font-weight: 900;
	font-size: 21px;
	line-height: 150px;
	color: #181818;
	letter-spacing: 4px;
	display: inline-block;
}
.letsproject-pan a:hover {
	color: #9a9a9a;
}
/* ===========================



========= 11. Footer ======== 



=========================== */



.footer {
	background-color: #181818;
	padding-top: 119px;
	padding-bottom: 143px;
	color: #999;
	font-weight: 200;
}
.footer address {
	font-size: 14px;
	line-height: 23px;
	font-style: normal;
	letter-spacing: 2px;
}
.footer address a {
	color: #999;
	display: block;
	text-decoration: none;
}
.footer address a:hover {
	color: #FFF;
}
.footer copyright {
	display: block;
	color: #999;
	font-size: 14px;
}
.footer menu.socil-icon-one {
	margin-left: 55px;
}
.footer menu.socil-icon-two {
	margin-left: 16px
}
.footer ul li {
	text-transform: uppercase;
	font-size: 13px;
	line-height: 37px;
	list-style: none;
	letter-spacing: 3px;
	font-weight: 200;
}
.footer ul li a {
	display: block;
	color: #999;
}
.footer ul li a:hover {
	color: #FFF;
}
.footer p {
	font-size: 12px;
	line-height: 13px;
	letter-spacing: 2px;
	padding-top: 2px
}
.footer address figure {
	padding-bottom: 20px;
}
/* ===========================



========= 12. Header Inner Banner ======== 



=========================== */



.header_inner_banner {
	width: 100%;
	position: relative;
}
.header_inner_banner figure img {
	width: 100%;
	margin: 0 auto;
}
.header_inner_banner .header-title {
	text-transform: uppercase;
	position: absolute;
	z-index: 60;
	right: 0;
	left: 0;
	text-align: center;
	top: 0;
	padding-top: 170px;
    font-family: var(--subtitle-font);
    color: white;
}
.header_inner_banner .header-title h2 {
	color: #FFF;
	font-weight: 400;
	font-size: 4em;
	line-height: 33px;
	letter-spacing: 7px;
	font-family: var(--subtitle-font);
}
.header_inner_banner .header-title p {
	font-size: 12px;
	line-height: 14px;
	color: #8d8d8d;
	letter-spacing: 4px;
	padding-top: 12px;
}
.header_inner_banner .bg_overlay {
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
	right: 0;
	top: 0;
	background-color: rgba(0, 0, 0, .5);
}
/* ===========================



========= 13. About Pan ======== 



=========================== */



.about_pan {
	background-color: inherit;
	padding-bottom: 100px;
}
/* ===========================



========= 14. The History ======== 



=========================== */

.the-history {
    margin-top: 50px;
}

.history-col {
    padding:30px;
    margin-left: -5px;
    margin-right: 5px;
}


.the-history article {
	padding-left: 39px;
}
.the-history article h6 {
	text-transform: uppercase;
	font-weight: 800;
	color: #000;
	font-size: 24px;
	line-height: 15px;
	letter-spacing: 5px;
	padding-bottom: 19px;
	font-family: var(--p-font);
}
.the-history article p {
	font-size: 20px;
	line-height: 27px;
	/*letter-spacing: 1px;*/
	color: #555;
	/*font-weight: 300;*/
	padding-bottom: 26px;
	font-family: var(--p-font);
	/*font-family: var(--title-font);*/
}
/* ===========================



========= 15. The Team ======== 



=========================== */



.the-team {
	padding-top: 63px;
}
.the-team .header-title {
	text-align: center;
	text-transform: uppercase;
}
.the-team .header-title h2 {
	color: #130e14;
	font-weight: 800;
	font-size: 27px;
	line-height: 28px;
	letter-spacing: 3.5px;
	padding-bottom: 5px
}
.the-team .header-title p {
	color: #232024;
	font-size: 13px;
	line-height: 14px;
	letter-spacing: 7px;
}
.tema-images {
	padding-top: 109px;
	overflow: hidden;
	margin-bottom:50px;
}
.tema-images li {
	overflow: hidden;
	text-align: center;
	text-transform: uppercase
}
.tema-images li figure {
	width: 100%;
	overflow: hidden;
	position: relative;
}
.tema-images li figure img {
	margin: 0 auto;
	display: block;
	-moz-transition: all, 0.5s;
	-o-transition: all, 0.5s;
	-webkit-transition: all, 0.5s;
	transition: all, 0.5s;
}
.tema-images li:hover img {
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}
.tema-images li .section {
	background: rgba(0, 0, 0, 0.5);
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	width: 100%;
	-moz-transition: opacity, 0.3s;
	-o-transition: opacity, 0.3s;
	-webkit-transition: opacity, 0.3s;
	transition: opacity, 0.3s;
}
.tema-images li .social_icons {
	position: absolute;
	text-align: center;
	top: 68%;
	width: 100%;
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.tema-images li .social_icons a {
	width: 28px;
	height: 28px;
	border-radius: 100%;
	background-color: #FFF;
	text-align: center;
	line-height: 28px;
	font-size: 14px;
	display: inline-block;
	margin: 0 3px;
	-moz-transform: translate3d(0, -200%, 0);
	-ms-transform: translate3d(0, -200%, 0);
	-webkit-transform: translate3d(0, -200%, 0);
	transform: translate3d(0, -200%, 0);
	-moz-transition: all, 0.5s;
	-o-transition: all, 0.5s;
	-webkit-transition: all, 0.5s;
	transition: all, 0.5s;
}
.tema-images li .social_icons a i {
	opacity: 0.5;
}
.tema-images li:hover .section {
	opacity: 1;
}
.tema-images li:hover social_icons a {
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.tema-images li .social_icons a:hover {
	background-color: #fff445;
}
.tema-images li header {
	padding-top: 36px;
 	/*																			padding-bottom:*/
}
.tema-images li header h5, .tema-images li header h6 {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 13px;
	line-height: 14px;
}
.tema-images li header h5 {
	font-weight: 700;
	color: #232024;
	letter-spacing: 6px;
	padding-bottom: 9px;
}
.tema-images li header h6 {
	color: #8d8d8d;
	letter-spacing: 6px;
}
/* ===========================



========= 16. Our expertise ======== 



=========================== */



.our-expertis {
	padding-top: 93px;
	padding-bottom: 82px;
}
.our-expertis article h6 {
	text-transform: uppercase;
	font-size: 13px;
	line-height: 15px;
	color: #000;
	font-weight: 800;
	font-family: var(--title-font);
	letter-spacing: 5px;
	padding-bottom: 12px;
}
.our-expertis article p {
	font-size: 15px;
	line-height: 27px;
	color: #555;
	letter-spacing: 1px;
	font-weight: 300;
	padding-bottom: 25px;
}
.progress_barpan section {
	padding-left: 47px
}
.progress_barpan ul {
	list-style: none;
}
.progress_barpan li {
	position: relative;
	margin-bottom: 38px;
}
.progress_barpan li .progress {
	height: 3px;
	border-radius: 0;
	background-color: #dbdbdb;
	max-width: 560px;
	box-shadow: none;
	margin-bottom: 0;
}
.progress_barpan li .progress .progress-bar {
	box-shadow: none;
	background-color: #232024;
}
.progress_barpan li h5 {
	text-transform: uppercase;
	letter-spacing: 6px;
	color: #232024;
	font-family: var(--title-font);
	font-size: 13px;
	line-height: 14px;
	padding-bottom: 19px;
}
.progress_barpan li h6 {
	color: #232024;
	letter-spacing: 2px;
	font-size: 13px;
	line-height: 14px;
	font-weight: 400;
	float: right;
	font-family: var(--title-font);
	position: absolute;
	right: 0;
	top: 71%;
}
/* ===========================



========= 17. works ======== 



=========================== */



.works_wrapper {
	padding-top: 95px;
	padding-bottom: 120px;
}
.works_wrapper ul.works-nav {
	text-align: center;
}
.works_wrapper ul.works-nav li {
	display: inline-block;
	cursor: pointer;
	text-transform: uppercase;
	font-weight: 400;
	font-size: 13px;
	line-height: 18px;
	color: #555;
	letter-spacing: 4px;
	background-image: url(../images/devider.jpg);
	background-position: 0 4px;
	background-repeat: no-repeat;
	padding-left: 18px;
	padding-right: 18px;
	font-family: var(--subtitle-font);
}
.works_wrapper ul.works-nav li:last-child {
	padding-right: 0;
}
.works_wrapper ul.works-nav li:first-child {
	padding-left: 0;
	background-image: none;
}
.works_wrapper ul.works-nav li.active {
	color: #000000;
}
.works_wrapper .projects-images {
	padding-top: 80px;
}
.works_images ul li figcaption {
	background: rgba(234, 234, 234, 0.9);
}
.works_images ul li:hover img {
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}
.works_images ul li:hover .figcaption {
	opacity: 1;
}
.works_images ul li h5 {
	font-size: 13px;
	line-height: 14px;
	font-weight: 800;
	letter-spacing: 6px;
	padding-bottom: 7px;
}
.works_images ul li h5, .works_images ul li p {
	color: #130e14;
	text-transform: uppercase;
}
.works_images ul li p {
	font-size: 12px;
	line-height: 13px;
	letter-spacing: 4px;
}
.works_images ul li a {
	width: 22px;
	height: 22px;
	border: 1px solid #000;
	display: inline-block;
	text-align: center;
	border-radius: 100%;
	margin-bottom: 18px;
	-moz-transform: translate3d(0, -900%, 0);
	-ms-transform: translate3d(0, -900%, 0);
	-webkit-transform: translate3d(0, -900%, 0);
	transform: translate3d(0, -900%, 0);
	text-align: center;
	font-size: 14px;
	line-height: 20px;
	color: #000;
}
.works_images ul li:hover a {
	opacity: 1;
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.works_images ul li a:hover {
	background-color: #fff445;
	border-color: #dbd01c;
}

.work { 
  padding: calc(var(--space-around) * 2); 
}
.work:hover {
  cursor: pointer; 
}
@media (max-width: 481px) {
  .work { display: block; margin-right: auto; margin-left: auto; float: none; margin: 0 auto; }
  .work:hover { cursor: pointer; }
}
/* ===========================



========= 18. Services ======== 



=========================== */



.all-serivices {
	background-color: #f0f0f0;
	padding-top: 100px;
	padding-bottom: 96px;
}
.all-serivices section {
	text-align: center;
}
.all-serivices section h3 {
	text-transform: uppercase;
	color: #060606;
	font-family: var(--subtitle-font);
	font-size: 13px;
	line-height: 15px;
	display: block;
	letter-spacing: 6px;
	font-weight: 800;
	padding-bottom: 22px;
}
.all-serivices section p {
	font-size: 15px;
	line-height: 23px;
	color: #555;
	letter-spacing: 2px;
	font-weight: 300;
}
.all-serivices section span {
	display: inline-block;
	width: 40px;
	height: 40px;
	border-radius: 100%;
	text-align: center;
	color: #FFF;
	line-height: 40px;
	font-size: 18px;
	background-color: #060606;
	margin-bottom: 23px;
}
.all-serivices section:hover span {
	background-color: #fff445;
	transition-delay: 0s;
	transition-duration: 0.6s;
	transition-property: all;
	transition-timing-function: ease;
}
.services-text {
	overflow: hidden;
	padding-top: 92px;
	padding-bottom: 50px;
}
.services-text article h4 {
	font-weight: 300;
	font-size: 19px;
	line-height: 37px;
	letter-spacing: 2px;
	color: #3f3b40;
	font-family: var(--subtitle-font);
	padding-bottom: 39px;
}
.services-text article p {
	font-weight: 300;
	font-size: 15px;
	line-height: 23px;
	letter-spacing: 2px;
	padding-bottom: 23px;
}
.services-text figure {
	float: right;
}
.area-expertise {
	padding-bottom: 110px;
	overflow: hidden;
}
.area-expertise h6, .contact-wrapper aside h6 {
	font-family: var(--subtitle-font);
	text-transform: uppercase;
	font-size: 13px;
	line-height: 15px;
	color: #000;
	font-weight: 800;
	letter-spacing: 5px;
	padding-bottom: 26px;
}
.area-expertise ul li {
	color: #4e4a4f;
	font-size: 15px;
	line-height: 30px;
	display: block;
	font-weight: 300;
	letter-spacing: 2px;
	padding-left: 22px;
	background-image: url(../images/devider-serivces.png);
	background-repeat: no-repeat;
	background-position: 0 15px;
}
/* ===========================



========= 19. Blog ======== 



=========================== */



.blog-wrapper {
	padding-top: 99px;
	padding-bottom: 71px;
}
.blog-wrapper .blog_left {
	padding-right: 39px;
}
.blog-wrapper .blog_right {
	float: right;
	padding: 0;
}
.blog_left article {
	margin-bottom: 99px;
}
.blog_left article header .post-date {
	font-family: var(--title-font);
	font-size: 14px;
	line-height: 14px;
	color: #555;
	letter-spacing: 2px;
	font-weight: 300;
	text-transform: uppercase;
	padding-bottom: 13px;
}
.blog_left article header h5 {
	font-family: var(--subtitle-font);
	letter-spacing: 2px;
	font-weight: 300;
	font-size: 19px;
	line-height: 20px;
	padding-bottom: 26px;
}
.blog_left article header h5 a {
	color: #130e14
}
.blog_left article header h5 a:hover {
	text-decoration: underline;
	color: #7f7c45
}
.blog_left article header .authore-cat-comment {
	text-transform: uppercase;
	font-size: 12px;
	line-height: 14px;
	letter-spacing: 2px;
	color: #555;
	font-weight: 600;
	margin-bottom: 41px;
}
.blog_left article header .authore-cat-comment a {
	color: #939393;
}
.blog_left article header .authore-cat-comment a:hover {
	color: #000
}
.blog_left article p {
	font-size: 15px;
	line-height: 23px;
	letter-spacing: 2px;
	color: #555;
	font-weight: 300;
}
.blog_left article .continue-button {
	display: block;
	width: 178px;
	line-height: 49px;
	text-align: center;
	color: #FFF;
	text-transform: uppercase;
	font-weight: 200;
	letter-spacing: 5px;
	font-size: 12px;
	background-color: #000;
	margin-top: 45px;
}
.blog_left article .continue-button:hover {
	background-color: #fff445;
	color: #000;
}
.blog_left article .blog-slider-pan {
	position: relative;
	margin-bottom: 79px;
}
.blog_left article .blog-slider-pan ul li {
	list-style: none;
	width: 100%;
}
.blog_left article .blog-slider-pan .owl-buttons div {
	position: absolute;
	top: 50%;
	z-index: 60;
	width: 54px;
	height: 17px;
	background-position: 0 0;
	background-repeat: no-repeat;
	font-size: 0;
}
.blog_left article .blog-slider-pan .owl-buttons div.owl-prev {
	left: 17px;
	background-image: url(../images/blog/left-arrow.jpg)
}
.blog_left article .blog-slider-pan .owl-buttons div.owl-next {
	right: 17px;
	background-image: url(../images/blog/right-arrow.jpg)
}
.blog_left article figure, .blog_left article .video {
	margin-bottom: 79px;
}
.pagination {
	overflow: hidden;
	width: 100%
}
.pagination ul {
	list-style: none;
}
.pagination ul li {
	display: inline-block;
	font-size: 15px;
	font-weight: 600;
	text-align: center;
	margin: 0 3px;
	text-transform: uppercase
}
.pagination ul li > a {
	display: table-cell;
	line-height: 40px;
	border: 1px solid #a3a3a3;
	width: 40px;
}
.pagination ul li:first-child a {
	width: 79px;
	float: left;
	margin-right: 173px;
	margin-left: 0;
}
.pagination ul li:last-child a {
	width: 79px;
	float: right;
	margin-left: 111px;
	margin-right: 0;
}
.pagination ul li > a:hover {
	background-color: #fff445;
}
.blog_right aside.search-from {
	margin-bottom: 78px;
}
.blog_right aside.search-from form {
	position:relative;
}
.blog_right aside.search-from form label {
	display:block;
	width:100%;
}
.blog_right aside.search-from form label:before {
	content:"\f002";
	font-family:'FontAwesome';
	font-size:21px;
	line-height:41px;
	text-align:right;
	position: absolute;
	right:15px;
	top:0;
	font-weight:400;
}
.blog_right aside.search-from input {
	width: 100%;
	font-size: 14px;
	line-height: 18px;
	color: #000;
	height: 44px;
	border: 1px solid #cdcdcd;
	padding: 0 10px;
	transition-delay: 0s;
	transition-duration: 0.6s;
	transition-property: all;
	transition-timing-function: ease;
}
.blog_right aside.search-from input:focus {
	border-color: #fff445;
}
.blog_right aside h6 {
	text-transform: uppercase;
	font-size: 13px;
	line-height: 14px;
	color: #000;
	font-family: var(--subtitle-font);
	font-weight: 900;
	letter-spacing: 4px;
	padding-bottom: 34px;
}
.blog_right aside.categories-pan {
	margin-bottom: 53px;
}
.blog_right aside.categories-pan ul {
	list-style: none;
}
.blog_right aside.categories-pan ul li {
	display: block;
	font-size: 15px;
	line-height: 18px;
	font-weight: 500;
	letter-spacing: 1px;
	background-image: url(../images/devider-serivces.png);
	background-position: 0 9px;
	background-repeat: no-repeat;
	padding-left: 21px;
	padding-bottom: 21px;
}
.blog_right aside.categories-pan ul li a {
	color: #555;
}
.blog_right aside.categories-pan ul li a:hover {
	color: #000;
}
.blog_right aside.recent-post-pan {
	margin-bottom: 58px;
}
.blog_right aside.recent-post-pan ul {
	list-style: none;
}
.blog_right aside.recent-post-pan ul li {
	overflow: hidden;
	margin-bottom: 20px;
}
.blog_right aside.recent-post-pan ul li figure {
	float: left;
	width: 70px;
	overflow: hidden;
	height: 70px;
	margin-right: 30px;
}
.blog_right aside.recent-post-pan ul li .section {
	float: right;
}
.blog_right aside.recent-post-pan ul li .section a {
	display: block;
	color: #727172;
	font-size: 15px;
	line-height: 16px;
	letter-spacing: 1px;
	font-weight: 300;
	padding-bottom: 6px;
}
.blog_right aside.recent-post-pan ul li .section a:hover {
	color: #000;
	text-decoration: underline;
}
.blog_right aside.recent-post-pan ul li .section span {
	color: #555;
	font-size: 13px;
	line-height: 14px;
	text-transform: uppercase;
	font-weight: 300;
	letter-spacing: 1px;
}
.blog_right aside.flickr-feed-pan ul {
	list-style: none;
	overflow: hidden;
}
.blog_right aside.flickr-feed-pan ul li {
	display: inline-block;
	margin-bottom: 22px;
}
.blog_right aside.flickr-feed-pan ul li figure {
	width: 85px;
	height: 85px;
	overflow: hidden;
}
.blog_right aside.recent-post-pan ul li figure img {
	max-width: 100%;
	width: 100%;
	height: auto;
}
.blog_right aside.flickr-feed-pan ul li figure img {
	width: 100%;
	max-width: 100%;
	height: auto;
}
 .blog_right aside.flickr-feed-pan ul li:nth-child(2), .blog_right aside.flickr-feed-pan ul li:nth-child(5) {
 margin: 0 8px;
}
.blog-details-pan article {
	margin-bottom: 46px;
}
.blog-details-pan article p {
	padding-bottom: 24px;
}
.comments h6 {
	text-transform: uppercase;
	font-weight: 900;
	color: #000;
	letter-spacing: 3px;
	font-size: 17px;
	line-height: 18px;
	padding-bottom: 78px;
}
.comments ol, .comments ul {
	list-style: none;
}
.blog-details-pan .comments article, .blog-details-pan .comments article figure {
	margin-bottom: 0
}
.blog-details-pan .comments article figure {
	margin-right: 30px;
	float: left;
}
.blog-details-pan .comments article .comment-meta {
	overflow: hidden;
}
.blog-details-pan .comments article .comment-meta h5 {
	font-family: var(--subtitle-font);
	font-weight: 800;
	font-size: 13px;
	line-height: 14px;
	color: #000;
	letter-spacing: 1px;
	display: block;
	float: left;
	text-transform: uppercase;
}
.blog-details-pan .comments article .comment-meta h5 span {
	display: block;
	color: #555;
	font-weight: 300;
	padding-top: 15px;
}
.blog-details-pan .comments article .comment-meta .comment-reply-link {
	float: right;
	font-family: var(--p-font);
	color: #FFF;
	letter-spacing: 4px;
	font-size: 12px;
	line-height: 38px;
	background-color: #000000;
	text-transform: uppercase;
	display: block;
	width: 98px;
	text-align: center;
}
.blog-details-pan .comments article .comment-meta .comment-reply-link:hover {
	background-color: #fff445;
	color: #000000;
}
.blog-details-pan .comments article .comment-body {
	margin-left: 99px;
	padding-top: 28px;
}
.blog-details-pan .comments article .comment-body p {
	font-size: 15px;
	line-height: 23px;
	color: #555;
	font-weight: 300;
	letter-spacing: 2px;
}
.blog-details-pan .comments ol ul {
	margin-left: 99px;
	padding-top: 30px;
}
.blog-details-pan .leave-comment {
	padding-top: 86px;
}
.blog-details-pan .leave-comment h5 {
	font-family: var(--subtitle-font);
	text-transform: uppercase;
	font-size: 17px;
	line-height: 18px;
	color: #000;
	font-weight: 800;
	letter-spacing: 2px;
	padding-bottom: 78px;
}
.blog-details-pan .leave-comment input[type="text"], .blog-details-pan .leave-comment input[type="email"], .blog-details-pan .leave-comment textarea {
	font-family: var(--p-font);
	text-transform: capitalize;
	color: #555;
	font-size: 15px;
	line-height: 17px;
	letter-spacing: 1px;
	font-weight: 300;
	display: block;
	border-bottom: 1px solid #c3bec5;
	outline: none;
	border-left: none;
	border-right: none;
	border-top: none;
	width: 100%;
	padding-left: 23px;
	padding-right: 23px;
	padding-bottom: 18px;
	transition-delay: 0s;
	transition-duration: 0.6s;
	transition-property: all;
	transition-timing-function: ease;
}
.blog-details-pan .leave-comment input[type="text"], .blog-details-pan .leave-comment input[type="email"] {
	margin-bottom: 56px
}
.blog-details-pan .leave-comment input[type="submit"] {
	width: 100%;
	text-align: center;
	font-weight: 200;
	color: #FFF;
	border: none;
	outline: none;
	display: block;
	font-size: 12px;
	letter-spacing: 5px;
	line-height: 49px;
	height: 49px;
	background-color: #000;
	text-transform: uppercase;
	margin-top: 40px;
}
.blog-details-pan .leave-comment input[type="submit"]:hover {
	background-color: #fff445;
	color: #000;
}
.blog-details-pan .leave-comment input[type="text"]:focus, .blog-details-pan .leave-comment input[type="email"]:focus, .blog-details-pan .leave-comment textarea:focus {
	border-bottom-color: #fff445;
}
.video-iframe{ width:100%; height:400px;}
.video-video{ width:100%; height:100%}
/* ===========================



========= 20. Contact ======== 



=========================== */



.contact-wrapper {
	padding-top: 96px;
}
.contact-wrapper h5 {
	font-family: var(--subtitle-font);
	font-size: 22px;
	line-height: 20px;
	font-weight: 900;
	color: #4e4a4f;
	letter-spacing: 1px;
}
.contact-wrapper .contact-form {
	padding-top: 75px;
}
.contact-wrapper .contact-form input[type="text"]:focus, .contact-wrapper .contact-form input[type="email"]:focus, .contact-wrapper .contact-form input[type="tel"]:focus, .contact-wrapper .contact-form textarea:focus {
	border-bottom-color: #fff445;
}
.contact-wrapper .contact-form input[type="text"], .contact-wrapper .contact-form input[type="email"], .contact-wrapper .contact-form input[type="tel"] {
	width: 100%;
	display: inline-block;
	max-width: 332px;
	padding-bottom: 19px;
	margin-bottom: 56px;
	margin-right: 35px;
}
.contact-wrapper .contact-form input[type="text"], .contact-wrapper .contact-form input[type="email"], .contact-wrapper .contact-form input[type="tel"], .contact-wrapper .contact-form textarea {
	font-family: var(--p-font);
	font-size: 15px;
	line-height: 17px;
	color: #555;
	font-weight: 300;
	letter-spacing: 1px;
	padding-top: 10px;
	padding-left: 22px;
	padding-right: 10px;
	border-bottom: 1px solid #c3bec5;
	transition-delay: 0s;
	transition-duration: 0.6s;
	transition-property: all;
	transition-timing-function: ease;
}
.contact-wrapper .contact-form input[type="email"], .contact-wrapper .contact-form input[type="tel"] {
	margin-bottom: 45px;
}
.contact-wrapper .contact-form textarea {
	display: block;
	height: 104px;
	padding-bottom: 20px;
	outline: none;
	border-left: none;
	border-right: none;
	border-top: none;
	width: 100%;
	max-width: 700px;
	padding-top: 6px;
}
.contact-wrapper .contact-form input[type="submit"] {
	width: 100%;
	display: block;
	max-width: 701px;
	text-align: center;
	text-transform: uppercase;
	font-size: 12px;
	line-height: 49px;
	height: 49px;
	letter-spacing: 6px;
	background-color: transparent;
	border: none;
	outline: none;
	transition-delay: 0s;
	transition-duration: 0.6s;
	transition-property: all;
	transition-timing-function: ease;
	margin-top: 40px;
	font-weight: bold;
	color: #000;
	border: 1px solid #000;
	font-family: var(--title-font);
	/*font-size: calc(12px + (14 - 12) * ((100vw - 300px) / (1600 - 300)))!important;*/
	/*line-height: calc(1.3em + (1.5 - 1.2) * ((100vw - 300px)/(1600 - 300)))!important;  */	
}
.contact-wrapper .contact-form input[type="submit"]:hover {
	background-color: #000;
	color: #fff;
}
.contact-wrapper aside {
	padding-left: 37px;
}
.contact-wrapper aside h6 {
	padding-bottom: 30px;
	font-size: 17px;
	letter-spacing: 2px;
}
.contact-wrapper aside address {
	font-style: normal;
	font-size: 15px;
	line-height: 27px;
	color: #727172;
	font-weight: 300;
	letter-spacing: 1px;
	margin-bottom: 30px;
}
.contact-wrapper aside address a {
	color: #727172;
}
.contact-wrapper aside address a:hover {
	color: #000;
	text-decoration: underline;
}
.contact-wrapper aside .social_icons a {
	color: #222222;
	display: inline-block;
	font-size: 20px;
	line-height: 20px;
	padding-right: 26px;
}
.contact-wrapper aside .social_icons a:hover {
	color: #fff445;
}
.address-map {
	width: 100%;
	margin-top: 96px;
}
.address-map img {
	width: 100%;
	max-width: 100%;
	display: block;
}
.demo-wrapper {
	width: 100%;
	margin: 0 auto;
	height: 395px;
}
#surabaya {
	width: 100%;
	height: 100%;
}
.error_message {
	color: #ff675f;
	font-weight: 500;
	padding-bottom: 15px;
}
h3.succes_message {
	color: #3C3;
}
/* ===========================



========= 21. 404 Page ======== 



=========================== */



.pagenotfound-wrapper {
	text-align: center;
	padding-bottom: 120px;
	padding-top: 100px;
}
.pagenotfound-wrapper header {
	padding-bottom: 47px;
}
.pagenotfound-wrapper header h2 {
	display: inline-block;
	margin: 0 auto;
	width: 170px;
	line-height: 80px;
	font-family: var(--title-font);
	color: #FFF;
	font-size: 71px;
	font-weight: 100;
	letter-spacing: 12px;
	background-color: #000;
}
.pagenotfound-wrapper h5 {
	text-transform: uppercase;
	font-family: var(--subtitle-font);
	font-weight: 300;
	font-size: 19px;
	line-height: 20px;
	color: #4e4a4f;
	letter-spacing: 3px;
	padding-bottom: 28px;
}
.pagenotfound-wrapper p {
	color: #727172;
	font-size: 15px;
	line-height: 27px;
	letter-spacing: 1px;
	padding-bottom: 73px;
}
.pagenotfound-wrapper a {
	display: inline-block;
	width: 100%;
	max-width: 272px;
	line-height: 49px;
	background-color: #000;
	color: #FFF;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 5px;
}
.pagenotfound-wrapper a:hover {
	background-color: #fff445;
	color: #000;
}
/* ===========================



========= 22. Commingsoon Page ======== 



=========================== */



.commingsoon-main-wrapper .background {
	background: #FFF;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
}
.commingsoon-wrapper {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	z-index: 900;
	padding-top: 127px;
	font-family: var(--p-font);
	text-align: center;
}
.logo-commingsoon {
	padding-bottom: 45px;
}
.logo-commingsoon img {
	margin: 0 auto;
	display: block;
}
.commingsoon-content {
}
.commingsoon-content h2 {
	font-family: var(--title-font);
	text-transform: uppercase;
	color: #35373e;
	font-size: 39px;
	line-height: 40px;
	font-weight: 800;
	letter-spacing: 3px;
	padding-bottom: 23px;
}
.commingsoon-content p {
	font-family: var(--p-font);
	font-size: 18px;
	line-height: 24px;
	color: #35373e;
	font-weight: 300;
}
.notify-me-button {
	font-family: var(--title-font);
	text-transform: uppercase;
	font-size: 12px;
	display: block;
	margin: 44px auto;
	line-height: 49px;
	border: 2px solid #35373e;
	width: 161px;
	text-align: center;
	letter-spacing: 4px;
	font-weight: 600;
}
.notify-me-button:hover {
	background-color: #35373e;
	color:#FFF;
}
.commingsoon-wrapper footer #countdown {
	text-transform: uppercase;
}
.commingsoon-wrapper footer #countdown .item {
	display: inline-block;
	text-align: center;
	font-weight: 700;
	color: #35373e;
	font-size: 13px;
	letter-spacing: 1px;
	font-family: var(--subtitle-font);
	border-right: 1px solid #35373e;
	margin-right: 58px;
	padding-right: 62px;
}
.commingsoon-wrapper footer #countdown .item p {
	font-family: var(--p-font);
	font-size: 48px;
	line-height: 49px;
	font-weight: 700;
	display: block;
	padding-bottom: 11px;
}
.commingsoon-wrapper footer #countdown .item:last-child {
	border-right: none;
	margin-right: 0;
	padding-right: 0;
}
.commingsoon-wrapper .social-icon-wrapper {
	margin-top: 68px;
	margin-bottom: 60px;
}
.commingsoon-wrapper .social-icon-wrapper ul {
	text-align: center;
	list-style: none;
}
.commingsoon-wrapper .social-icon-wrapper ul li {
	display: inline-block;
}
.commingsoon-wrapper .social-icon-wrapper ul li a {
	text-align: center;
	border-radius: 100%;
	width: 30px;
	height: 30px;
	border: 1px solid #35373e;
	line-height: 27px;
	display: block;
	font-size: 19px;
	color: #35373e;
	margin-right: 11px;
}
.commingsoon-wrapper .social-icon-wrapper ul li a:hover {
	background-color: #35373e;
	color:#FFF;
}
.maintenance-main-wrapper {
	position: relative;
	height: 301px;
}
.maintenance-wrapper {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
}
.ntify_form {
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
	position: relative;
}
.ntify_form form {
	position:relative;
}
.ntify_form input[type="email"] {
	margin-top: 34px;
	height: 50px;
	width: 100%;
	outline: none;
	border: 1px solid #d2d4d7;
	display: block;
	background-color: transparent;
	padding-left: 22px;
	padding-right: 64px;
	font-size: 15px;
	color: #696b71;
	line-height: 16px;
}
.ntify_form input[type="email"]:focus {
	border-color: #35373e;
}
.ntify_form input[type="submit"] {
	border: none;
	outline: none;
	width: 60px;
	height: 50px;
	display: block;
	background-color: #35373e;
	font-size: 0;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
	background-repeat: no-repeat;
	background-position: center center;
}
.ntify_form label:before {
	content:"\f1d9";
	font-family:'FontAwesome';
	display:block;
	color:#bababd;
	font-size:28px;
	line-height:18px;
	position:absolute;
	right:16px;
	top:14px;
	z-index:1;
	text-align:center;
	cursor:pointer;
}
.ntify_form input[type="submit"]:hover {
	background-color: #35373e;
}
.notify-me-wrapper a {
	margin-top: 32px;
	display: block;
	font-family: var(--title-font);
	text-transform: uppercase;
	font-size: 12px;
	line-height: 13px;
	letter-spacing: 2px;
	color: #35373e;
}
.notify-me-wrapper a:hover {
	color: #35373e;
	text-decoration: underline;
}
.error_message {
	color: #fc6e51;
	padding-bottom: 15px;
	font-size: 13px;
	line-height: 30px;
}
#success_page {
	color: #9ce726;
	padding-bottom: 10px;
	font-size: 12px;
}
#success_page h3 {
	font-size: 17px;
	font-weight: 400px;
	color: #4ab217;
}
#success_page p {
	font-size: 12px;
	font-weight: 400px;
	color: #b3b3b3;
}

.main-block-text {
	position:relative;
	top: 25px !important;
	font-size: 20px;
	font-weight: bold;
	font-family: var(--title-font);
	font-size: 13px;
	line-height: 14px;
	text-transform: uppercase;
	color: #232024;
	letter-spacing: 5px;
}

.big-bg-container {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	padding:250px;
	margin-top: 70px;
	margin-bottom: 50px;
}

.all_view_link {
	top: 50px;
	position: relative;
}






.absolute-container {
	margin-bottom: 70px;
}



@media (min-width: 800px) {
	.image-testz2 {
		position: absolute;
		left:48.5%;
	}

	.absolute-text2 {
		top:30px;
		position: relative;
		float: left;
		border:1px solid grey;
		background-color: white;
		padding:30px;
		width:50% !important;
		z-index: 2;
	}

	.absolute-text2 ul {
		font-size: 18px;
	}

	.image-testz img {
		width: 70% !important;
	}

	.image-testz {
		position: absolute;
	}

	.image-testz2 img {
		width: 91% !important;
	}
	.image-testz3 {
		position: absolute;
		left:48.5%;
	}

	.image-testz3 img {
		width: 100% !important;
	}


	.absolute-text {
		top:30px;
		position: relative;
		float: right;
		border:1px solid grey;
		background-color: white;
		padding:30px;
		width:50% !important;
		margin-bottom: 50px;
	}
	.menu-open {
		display: block;
	}
}

@media (max-width: 800px) {

	.absolute-text {
		top: 30px;
		position: relative;
		float: right;
		background-color: white;
		padding: 30px;
		margin-bottom: 50px;
	}

	.absolute-text2 {
		top: 30px;
		position: relative;
		float: left;
		background-color: white;
		padding: 30px;
		margin-bottom:60px;
	}

	.absolute-text2 ul {
		font-size: 18px;
	}

	.menu-open {
		display: none;
	}
}



.d-inline {
	display: inline !important;
	margin-right: 15px;
	font-size: 18px;
}

.mb-50 {
	margin-bottom: 150px !important;
}

.mb-70 {
	margin-bottom: 150px !important;
}

.mb-20 {
	margin-bottom: 20px !important;
}

.panel {
	margin:0px !important;
	border: 0px !important;
}

.foglalas-btn {
	margin-top: 100px;
	margin-bottom: 30px;
	width:50%;
	height:100px;
	background-color: #181818 !important;
	font-size: 25px !important;
	text-transform: uppercase !important;
	font-weight: bold !important;
	color:white !important;
}

.place-btn {
    margin-top: 50px;
    margin-bottom: 60px !important;
    width:100%;
    height:70px;
    background-color: #181818 !important;
    font-size: 25px !important;
    text-transform: uppercase !important;
    font-weight: bold !important;
    color:white !important;
}

.description {
	font-size: 20px;
	padding-bottom: 30px;
}

.btn-primary {
	height:40px;
	background-color: #181818 !important;
	font-size: 20px !important;
	text-transform: uppercase !important;
	font-weight: bold !important;
	color:white !important;
}

.overlay {
	position: fixed; /* Sit on top of the page content */
	display: none; /* Hidden by default */
	width: 100%; /* Full width (cover the whole page) */
	height: 100%; /* Full height (cover the whole page) */
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.5); /* Black background with opacity */
	z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
	cursor: pointer; /* Add a pointer on hover */
	padding-top: 400px;
}

.overlay .row {
	position: absolute;
	top:-20%;
	left:0;
	right:0;
	margin-left:auto;
	margin-right:auto;
	width: fit-content;
	transition: all .9s ease 0s;
}

.overlay .row.overlay-anim {
	top:20% !important;
}

.overlay p {
	font-size: 18px;
	color:black;
	margin-bottom: 20px;
	margin-top: 20px;
	padding-left: 30px;
	padding-right: 30px;
}

.overlay select {
	width:400px;
	margin-left: 20px;
	margin-right: 20px;
}

.overlay .close-btn {
	background-color: lightgray !important;
	color: black !important;
	font-weight: normal !important;
	border: 0px !important;
	font-size: 18px !important;
}

.overlay .save-btn {
	font-weight: normal !important;
	border: 0px !important;
	font-size: 18px !important;
}



.overlay-title {
	color:white !important;
	background-color:#2b4875;
	font-size: 18px !important;
	text-align: left;
	padding: 20px 15px 20px 15px !important;
	margin-top: 0px !important;
	border-radius:3px 3px 0px 0px;
}

.summary-col {
    border:2px solid lightgrey;
    padding-top: 20px;
    margin-left: 5px;
    margin-right: -5px;
}

.summary-col h2 {
    margin-bottom: 10px;
}


.summary-title {
    text-align: right;
}

.summary-price {
    text-align: left;
}

.header .header_v1 figure figcaption h1 {
	color: #FFF;
	font-weight: 700;
	font-size: 53px;
	line-height: 54px;
	letter-spacing: 22px;
}

.packet {
	margin-bottom: 50px;
}

.order-row {
	margin-bottom: 20px;
}

.order-row h6 {
	text-align: left;
	font-size: 18px;
	font-weight: bold;
	text-transform: capitalize;
}

.order-row  .order-title-col {
	border-bottom: 1px solid lightgrey;
	margin-bottom: 10px;

}

@media (max-width: 800px) {
	.order-row p {
		margin-bottom: 15px;
	}
	.order-row .price {
		font-size: 12px;

	}
	.order-row .extra-check {
		font-size: 12px;
	}

	.order-row label {
		font-size: 12px;
	}
}

@media (min-width: 800px) {
	.order-row label {
		font-size: 14px;
	}
	.summary-row {
		padding-left: 50px !important;
	}
}

.order-row p {
	text-align: left;
}

.order-row .price {
	font-weight: bold;
	text-align: left !important;
	font-size: 1.2rem;
}

.order-row label {
	font-weight: bold;
	font-family: monospace;
	font-weight: 700;
	text-align: center;
	padding-left: 15px;
}

.order-row a {
	font-weight: bold;
	text-align: center;
	font-size: 14px;
	padding-left: 15px;
	font-family: monospace;
}

.order-row .extra-check {
	margin-right: 10px !important;
	padding-top: 20px !important;
}



.summary-row h5{
	margin-top: 30px;
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	text-transform: uppercase;
}

.item-counter {
	margin-bottom: 20px;
	font-weight: bold;
	margin-top: 15px;
}

#calendar {
	margin-bottom: 30px;
}

.overlay-col {
	background-color: white;
	border-radius: 3px;
	padding-bottom: 30px;
}

.defatag {
	color: #fff;
}
/* ===========================



========= 23. Clean.css Embedd ======== 



=========================== */

.sp {
  padding: var(--space-in);
  margin: var(--space-out);
  vertical-align: middle;  
}

.block-text {
    
    padding: var(--space-around);
    font-variant: small-caps;
    font-size: 150%;
    line-height: 3em;
    font-weight: 600; 
    letter-spacing: 1px;  
}


@media (max-width: 769px) {.col-lg-4.col-md-4.col-sm-6.center-block { float: none; }}

.padding-medium-top-bottom { padding: 60px; }

.jumbotron.page-heading-hero.banner {
    min-height: 100vh;
    max-height: calc(100vh - (var(--navbar-height)));
    background: -o-radial-gradient(rgba(0,0,0,0.1), rgb(0,0,0)), url('/static/frontend/images/mainpage3.jpg') center / cover no-repeat, #000000;
    background: radial-gradient(rgba(0,0,0,0.1), rgb(0,0,0)), url('/static/frontend/images/mainpage3.jpg') center / cover no-repeat, #000000;
    max-width: 100vw;
    margin: 0;
}

.jumbotron h1, 
.jumbotron .page-heading-title-group h1 {
    color: #fff !important;
    font-family: var(--title-font);
    font-weight: 300;
    font-size: 8vh;
    line-height: initial;
    float: none;
}

.page-heading-hero {
  height: 100vh;
  min-height: 300px;
  background: #4183D7;
  color: #fff;
  position: relative;
}

.page-heading-title-group, 
.page-heading-title-group p { color: #fff; }

.page-heading-title-group {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  top: 50%;
  transform: translate(0,-50%);
}

.page-heading-title-group p {
  max-width: 640px;
  margin: 20px auto;
}

p.lead.text-center.page-subheading {
  font-family: var(--p-font);
  letter-spacing: 2px;
}

/* =========== BUTTON/BTN SECT     */
a:active, 
a:hover { outline: 0; }

a:focus, 
img:focus, 
button:focus, 
.btn:focus { outline: none; }

a {
  background-color: transparent;  
  text-decoration: none;
  outline: none;
  color: #010101;
  -o-transition-delay: 0s;
     transition-delay: 0s;
  -o-transition-duration: 0.6s;
     transition-duration: 0.6s;
  -o-transition-property: all;
  transition-property: all;
  -o-transition-timing-function: ease;
     transition-timing-function: ease;
}

a.btn-fog {
    box-shadow: 1px 1px 3px 1px rgb(48,62,68);
    border-radius: 3px;
    color: var(--txt-col);
    margin: 0 auto;
}

.btn-fog:hover { opacity: 1;}

.all_view_link { top: 50px; position: relative; }

.link-all-btn { max-width: 250px; margin: 20px auto; }

.view_button {
    font-family: var(--title-font);
    /* font-variant: small-caps; */
    text-transform: capitalize;    
    font-variant: small-caps;
    font-size: 1.4em;
    line-height: 2em;
    display: block;
    margin: 70px auto;
    text-align: center;
    color: var(--txt-col);
    letter-spacing: 3px;
    width: 27vw;
    border-left: 2px solid #a3a4ab;
    border-right: 2px solid #a3a4ab;
    margin-bottom: 48px;
    padding: 0 1%;
}

.view_button:hover .btn-fog {
    background-color: #979797;
    color: white;
}


[role="button"] { cursor: pointer; }

.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}

.btn.active.focus, 
.btn.active:focus, 
.btn.focus, 
.btn:active.focus, 
.btn:active:focus, 
.btn:focus {
      outline: thin dotted;
      outline: 5px auto -webkit-focus-ring-color;
      outline-offset: -2px;
}

.btn.focus, 
.btn:focus, 
.btn:hover {
      color: #333;
      text-decoration: none;
}

.btn.active, 
.btn:active {
      background-image: none;
      outline: 0;
      -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
      box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}

 
/*========== BUTTON/BTN SECT END   */

.highlight-blue .buttons { text-align: center; }

.highlight-blue .buttons .btn {

      padding: 16px 32px;
      margin: 6px;
      border: none;
      background: none;
      box-shadow: none;
      text-shadow: none;
      opacity: 0.9;
      text-transform: uppercase;
      font-weight: bold;
      font-size: 13px;
      letter-spacing: 0.4px;
      line-height: 1;
}

.highlight-blue .buttons .btn:hover {  opacity: 1;}

.highlight-blue .buttons .btn:active { transform: translateY(1px);}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

[data-aos^=fade][data-aos^=fade] {  
  opacity: 0;  transition-property: opacity,transform;}

[data-aos^=fade][data-aos^=fade].aos-animate {
  opacity: 1;  transform: translateZ(0);}

[data-aos=fade-up] {    transform: translate3d(0,100px,0);}

[data-aos=fade-down] {  transform: translate3d(0,-100px,0);}

[data-aos=fade-right] { transform: translate3d(-100px,0,0);}

[data-aos=fade-left] {  transform: translate3d(100px,0,0);}

  article, 
  aside, 
  details, 
  figcaption, 
  figure, 
  hgroup, 
  main, 
  section, 
  summary { display: block; }

/*
figure { margin: 1em 40px; }

figure {
  margin: 0;
}*/
p.aos-init.aos-animate { padding: 0 1vh; }

.pt { padding-top: var(--navbar-height); }   

.item { padding: 2%; }

.item a:hover img { 
    background-color: #000;
    opacity: 1; 
}

.text-center { text-align: center;}

.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto; 
}

.container-fluid {
  margin-right: auto;
  margin-left: auto; 
}

@media (min-width: 768px) { .container { width: 750px; }}

@media (min-width: 992px) { .container { width: 970px; }}

@media (min-width: 1200px){ .container { width: 1170px;}}

.row {
  margin-right: -15px;
  margin-left: -15px; 
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, 
.col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, 
.col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, 
.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 
{ position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

@media (min-width: 768px) { .col-sm-12 { width: 100%; }}

@media (min-width: 768px) { .col-sm-4 { width: 33.33333333%; }}

@media (min-width: 992px) { .col-md-1, 
                            .col-md-10, 
                            .col-md-11, 
                            .col-md-12, 
                            .col-md-2, 
                            .col-md-3, 
                            .col-md-4, 
                            .col-md-5, 
                            .col-md-6, 
                            .col-md-7, 
                            .col-md-8, 
                            .col-md-9 { float: left; }}

@media (min-width: 992px) { .col-md-12 { width: 100%; }}

@media (min-width: 992px) { .col-md-4 { width: 33.33333333%; }}

@media (min-width: 1200px) {.col-lg-1, 
                            .col-lg-10, 
                            .col-lg-11, 
                            .col-lg-12, 
                            .col-lg-2, 
                            .col-lg-3, 
                            .col-lg-4, 
                            .col-lg-5, 
                            .col-lg-6, 
                            .col-lg-7, 
                            .col-lg-8, 
                            .col-lg-9 { float: left; }}

@media (min-width: 1200px) {.col-lg-12 { width: 100%; }}

@media (min-width: 1200px) {.col-lg-4 { width: 33.33333333%; }}

/* =============== LOGOES SECT           */
.logoes-pan {

  position: relative;
  padding-top: 48px;
  padding-bottom: 53px;
}

.logoes-pan > ul {

  margin: 0 auto;
  padding: 0 10%;
}

.logoes-pan > ul li {

  display: inline-block;
  margin: 0 10px;
  text-align: center;
}

.logoes-pan > ul li img {

  margin: 0 auto;
  display: block;
}

.logoes-pan .owl-buttons div {

  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 40%;
  cursor: pointer;
  width: 68px;
  height: 13px;
  background-position: 0 0;
  background-repeat: no-repeat;
}

.logoes-pan .owl-buttons div.owl-prev {

  left: 0;
  background-image: url(../images/prev.png);
}

.logoes-pan .owl-buttons div.owl-next {

  right: 0;
  background-image: url(../images/next.png);
}

.logo_hove, .center-block {

  align-items: center!important;
  float: none!important;
  margin: 0 auto!important;
}
/*=============== LOGOES SECTION END */






#topcontrol {

    -webkit-text-size-adjust: 100%;
	font-family: var(--p-font);
    font-size: 14px;
    line-height: 18px;
    color: #4e4a4f;
    font-weight: 400;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    border: 0;
    outline: 0;
	width: 10vw;
	height: 10vh;
    display: block;
    bottom: 5px !important;
    right: 20px !important;
    transition-duration: 0.6s;
    transition-property: all;
    transition-timing-function: ease;
    position: fixed;
    opacity: 1;
    cursor: pointer;
	background-color: #000;
    z-index: 999;
}

#topcontrol:hover { background-color: rgba(0,0,0,0)!important; }

#topcontrol:before {

      content: "\f106";
      font-family: "FontAwesome";
	color: #130e1487;
      text-align: center;
      line-height: 30px;
      display: block;
	font-size: 6em;                                  
	text-shadow: 0px 0px 10px rgb(255 255 255 / 87%);
   /* text-shadow: 1px -2px 2px rgba(255,255,255,0.91);
	text-shadow: rgba(255,255,255,0.57) 1px 0px 0px, rgb(255, 255, 255) 0.8px -0.0px 0px, rgb(255, 255, 255) 0.1px 0.7px 0px, rgb(255, 255, 255) 0.141474px 1.99499px 0px, rgb(255, 255, 255) -0.832294px 1.81859px 0px, rgb(255, 255, 255) -1.60229px 1.19694px 0px, rgb(255, 255, 255) -1.97998px 0.28224px 0px, rgb(255, 255, 255) -1.87291px -0.701566px 0px, rgb(255, 255, 255) -1.30729px -1.5136px 0px, rgb(255, 255, 255) -0.4px 0px 0px, rgb(255, 255, 255) 0.567324px -1.91785px 0px, rgb(255, 255, 255) 0.4px -1.41108px 0px, rgb(255, 255, 255) 1.92034px -0.558831px 0px;*/
}
  

  div#alrt {

       margin-top: 2%;
      margin-left: auto;
      margin-right: auto;
      float: none;
  }

  .panel.panel-warning.fade.show {
      /* color: black; */
      /* font-size: 23px; 
      font-family: Raleway, sans-serif;*/
      background: rgba(255,255,255,0);
      border-style: solid;
      box-shadow: 0px 0px 2px 0px;
      padding: 2vh 2vw;
      background: rgba(211,211,211,0.47);  
    }

  button.close { float: right; }

  a[role="button"].btn-fog {

      border-radius: 3px;
      font-family: var(--title-font);
      font-size: 16px;
      line-height: 28.8px;
      font-variant: small-caps;
      height: 49px;
      width: 192px;
      text-transform: uppercase;
      letter-spacing: 2px;
      font-weight: 700;
      opacity: 0.9;    
  }

  a[role="button"].btn-fog:hover {

      opacity: 1;
      color: var(--txt-col-light);
      background-color: rgba(0,0,0,0.5);
      box-shadow: none;
  }

.foglalas {

    -moz-border-radius: 3px;
    -moz-box-shadow: #ababab 1px 3px 10px;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -webkit-border-radius: 3px;
    -webkit-box-shadow: #6E7849 0 0 10px;
    -webkit-transition: all 0.5s ease;
    background-color: #ffffff;
    border-radius: 3px;
    border: 1px solid #4a5032;
    box-shadow: #ababab 1px 3px 10px;
    color: #7a7a7a;
    display: inline-block;
    font-family: Verdana;
    font-size: 1.6em;
    margin: auto;
    padding: 17px;
    text-decoration: none;
    transition: all 0.5s ease;
    width: 50%;
}

.foglalas:hover {

    background-color: #a1a1a1;
    border: 1px solid #4a5032;
    color: #f5f5f5;
    font-size: 1.6em;
    padding: 17px;
    width: 50%;
}
/*
========= 7. Latest Project ======== 



=========================== */

  .latest-projects-pan { padding-top: 0 }

  .latest-projects-top header h3 {

    font-size: 32px;
    line-height: 2em;
    text-transform: capitalize;
    color: #130e14;
    font-weight: 700;
	font-family: var(--title-font);
    padding-bottom: 6px;
  }

  .latest-projects-top header h6 {

	font-family: var(--subtitle-font);
    font-size: 20px;
    line-height: 14px;
    text-transform: capitalize;
    color: #232024;
    letter-spacing: 5px;
    font-variant: small-caps;
  }

  .latest-projects-top > ul {

    text-align: right;
    padding-top: 15px;
  }

  .latest-projects-top > ul > li {

    display: inline-block;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 13px;
    line-height: 18px;
    color: #000;
    letter-spacing: 4px;
    background-image: url(../images/devider.jpg);
    background-position: 0 4px;
    background-repeat: no-repeat;
    padding-left: 18px;
    padding-right: 18px;
  }

  .latest-projects-top > ul > li:last-child { padding-right: 0; }

  .latest-projects-top > ul > li:first-child { padding-left: 0; background-image: none; }

  .latest-projects-top > ul > li.active { color: #89878a; }

/* ===========================



=== 24. Datepicker Styles ====



=========================== */

.datepicker {
	padding: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	direction: ltr;
}

.datepicker {
	padding: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	direction: ltr;
}

.datepicker {
	border-radius: 4px;
	direction: ltr;
}

div.wrapper {
	overflow: hidden;
}

.datepicker {
	padding: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	direction: ltr;
}

.datepicker-inline {
	width: 220px;
}

.datepicker.datepicker-rtl {
	direction: rtl;
}

.datepicker.datepicker-rtl table tr td span {
	float: right;
}

.datepicker-dropdown {
	top: 0;
	left: 0;
	padding: 4px;
}

.datepicker-dropdown:before {
	content: '';
	display: inline-block;
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-bottom: 7px solid #999;
	border-top: 0;
	border-bottom-color: rgba(0,0,0,.2);
	position: absolute;
}

.datepicker-dropdown:after {
	content: '';
	display: inline-block;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 6px solid #fff;
	border-top: 0;
	position: absolute;
}

.datepicker-dropdown.datepicker-orient-left:before {
	left: 6px;
}

.datepicker-dropdown.datepicker-orient-left:after {
	left: 7px;
}

.datepicker-dropdown.datepicker-orient-right:before {
	right: 6px;
}

.datepicker-dropdown.datepicker-orient-right:after {
	right: 7px;
}

.datepicker-dropdown.datepicker-orient-bottom:before {
	top: -7px;
}

.datepicker-dropdown.datepicker-orient-bottom:after {
	top: -6px;
}

.datepicker-dropdown.datepicker-orient-top:before {
	bottom: -7px;
	border-bottom: 0;
	border-top: 7px solid #999;
}

.datepicker-dropdown.datepicker-orient-top:after {
	bottom: -6px;
	border-bottom: 0;
	border-top: 6px solid #fff;
}

.datepicker > div {
	display: none;
}

div.cal-box {
	height: 130px;
}

div.wrapper {
	overflow: hidden;
}

.datepicker table {
	margin: 0;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.datepicker td, .datepicker th {
	text-align: center;
	width: 20px;
	height: 20px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	border: none;
}

.table-striped .datepicker table tr td, .table-striped .datepicker table tr th {
	background-color: transparent;
}

.datepicker table tr td.day.focused, .datepicker table tr td.day:hover {
	background: #eee;
	cursor: pointer;
}

.datepicker table tr td.new, .datepicker table tr td.old {
	color: #999;
}

.datepicker table tr td.day:hover, .datepicker table tr td.focused {
	background: #eee;
	cursor: pointer;
}

.datepicker table tr td.disabled, .datepicker table tr td.disabled:hover {
	background: 0 0;
	color: #999;
	cursor: default;
}

.datepicker table tr td.highlighted {
	background: #d9edf7;
	border-radius: 0;
}

.datepicker table tr td.today, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled:hover, .datepicker table tr td.today:hover {
	background-color: #fde19a;
	background-image: -moz-linear-gradient(to bottom,#fdd49a,#fdf59a);
	background-image: -ms-linear-gradient(to bottom,#fdd49a,#fdf59a);
	background-image: -webkit-gradient(linear,0 0,0 100%,from(#fdd49a),to(#fdf59a));
	background-image: -webkit-linear-gradient(to bottom,#fdd49a,#fdf59a);
	background-image: -o-linear-gradient(to bottom,#fdd49a,#fdf59a);
	background-image: linear-gradient(to bottom,#fdd49a,#fdf59a);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdd49a', endColorstr='#fdf59a', GradientType=0);
	border-color: #fdf59a #fdf59a #fbed50;
	border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	color: #000;
}

.datepicker table tr td.today.active, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled.active, .datepicker table tr td.today.disabled.disabled, .datepicker table tr td.today.disabled:active, .datepicker table tr td.today.disabled:hover, .datepicker table tr td.today.disabled:hover.active, .datepicker table tr td.today.disabled:hover.disabled, .datepicker table tr td.today.disabled:hover:active, .datepicker table tr td.today.disabled:hover:hover, .datepicker table tr td.today.disabled:hover[disabled], .datepicker table tr td.today.disabled[disabled], .datepicker table tr td.today:active, .datepicker table tr td.today:hover, .datepicker table tr td.today:hover.active, .datepicker table tr td.today:hover.disabled, .datepicker table tr td.today:hover:active, .datepicker table tr td.today:hover:hover, .datepicker table tr td.today:hover[disabled], .datepicker table tr td.today[disabled] {
	background-color: #fdf59a;
}

.datepicker table tr td.today.active, .datepicker table tr td.today.disabled.active, .datepicker table tr td.today.disabled:active, .datepicker table tr td.today.disabled:hover.active, .datepicker table tr td.today.disabled:hover:active, .datepicker table tr td.today:active, .datepicker table tr td.today:hover.active, .datepicker table tr td.today:hover:active {
	background-color: #fbf069\9;
}

.datepicker table tr td.today:hover:hover {
	color: #000;
}

.datepicker table tr td.today.active:hover {
	color: #fff;
}

.datepicker table tr td.range, .datepicker table tr td.range.disabled, .datepicker table tr td.range.disabled:hover, .datepicker table tr td.range:hover {
	background: #eee;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

.datepicker table tr td.range.today, .datepicker table tr td.range.today.disabled, .datepicker table tr td.range.today.disabled:hover, .datepicker table tr td.range.today:hover {
	background-color: #f3d17a;
	background-image: -moz-linear-gradient(to bottom,#f3c17a,#f3e97a);
	background-image: -ms-linear-gradient(to bottom,#f3c17a,#f3e97a);
	background-image: -webkit-gradient(linear,0 0,0 100%,from(#f3c17a),to(#f3e97a));
	background-image: -webkit-linear-gradient(to bottom,#f3c17a,#f3e97a);
	background-image: -o-linear-gradient(to bottom,#f3c17a,#f3e97a);
	background-image: linear-gradient(to bottom,#f3c17a,#f3e97a);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3c17a', endColorstr='#f3e97a', GradientType=0);
	border-color: #f3e97a #f3e97a #edde34;
	border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

.datepicker table tr td.range.today.active, .datepicker table tr td.range.today.disabled, .datepicker table tr td.range.today.disabled.active, .datepicker table tr td.range.today.disabled.disabled, .datepicker table tr td.range.today.disabled:active, .datepicker table tr td.range.today.disabled:hover, .datepicker table tr td.range.today.disabled:hover.active, .datepicker table tr td.range.today.disabled:hover.disabled, .datepicker table tr td.range.today.disabled:hover:active, .datepicker table tr td.range.today.disabled:hover:hover, .datepicker table tr td.range.today.disabled:hover[disabled], .datepicker table tr td.range.today.disabled[disabled], .datepicker table tr td.range.today:active, .datepicker table tr td.range.today:hover, .datepicker table tr td.range.today:hover.active, .datepicker table tr td.range.today:hover.disabled, .datepicker table tr td.range.today:hover:active, .datepicker table tr td.range.today:hover:hover, .datepicker table tr td.range.today:hover[disabled], .datepicker table tr td.range.today[disabled] {
	background-color: #f3e97a;
}

.datepicker table tr td.range.today.active, .datepicker table tr td.range.today.disabled.active, .datepicker table tr td.range.today.disabled:active, .datepicker table tr td.range.today.disabled:hover.active, .datepicker table tr td.range.today.disabled:hover:active, .datepicker table tr td.range.today:active, .datepicker table tr td.range.today:hover.active, .datepicker table tr td.range.today:hover:active {
	background-color: #efe24b\9;
}

.datepicker table tr td.selected, .datepicker table tr td.selected.disabled, .datepicker table tr td.selected.disabled:hover, .datepicker table tr td.selected:hover {
	background-color: #9e9e9e;
	background-image: -moz-linear-gradient(to bottom,#b3b3b3,grey);
	background-image: -ms-linear-gradient(to bottom,#b3b3b3,grey);
	background-image: -webkit-gradient(linear,0 0,0 100%,from(#b3b3b3),to(grey));
	background-image: -webkit-linear-gradient(to bottom,#b3b3b3,grey);
	background-image: -o-linear-gradient(to bottom,#b3b3b3,grey);
	background-image: linear-gradient(to bottom,#b3b3b3,grey);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3b3b3', endColorstr='#808080', GradientType=0);
	border-color: grey grey #595959;
	border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	color: #fff;
	text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}

.datepicker table tr td.selected.active, .datepicker table tr td.selected.disabled, .datepicker table tr td.selected.disabled.active, .datepicker table tr td.selected.disabled.disabled, .datepicker table tr td.selected.disabled:active, .datepicker table tr td.selected.disabled:hover, .datepicker table tr td.selected.disabled:hover.active, .datepicker table tr td.selected.disabled:hover.disabled, .datepicker table tr td.selected.disabled:hover:active, .datepicker table tr td.selected.disabled:hover:hover, .datepicker table tr td.selected.disabled:hover[disabled], .datepicker table tr td.selected.disabled[disabled], .datepicker table tr td.selected:active, .datepicker table tr td.selected:hover, .datepicker table tr td.selected:hover.active, .datepicker table tr td.selected:hover.disabled, .datepicker table tr td.selected:hover:active, .datepicker table tr td.selected:hover:hover, .datepicker table tr td.selected:hover[disabled], .datepicker table tr td.selected[disabled] {
	background-color: grey;
}

.datepicker table tr td.selected.active, .datepicker table tr td.selected.disabled.active, .datepicker table tr td.selected.disabled:active, .datepicker table tr td.selected.disabled:hover.active, .datepicker table tr td.selected.disabled:hover:active, .datepicker table tr td.selected:active, .datepicker table tr td.selected:hover.active, .datepicker table tr td.selected:hover:active {
	background-color: #666\9;
}

.datepicker table tr td.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active:hover {
	background-color: #006dcc;
	background-image: -moz-linear-gradient(to bottom,#08c,#04c);
	background-image: -ms-linear-gradient(to bottom,#08c,#04c);
	background-image: -webkit-gradient(linear,0 0,0 100%,from(#08c),to(#04c));
	background-image: -webkit-linear-gradient(to bottom,#08c,#04c);
	background-image: -o-linear-gradient(to bottom,#08c,#04c);
	background-image: linear-gradient(to bottom,#08c,#04c);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
	border-color: #04c #04c #002a80;
	border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	color: #fff;
	text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}

.datepicker table tr td.active.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled.disabled, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active.disabled:hover.active, .datepicker table tr td.active.disabled:hover.disabled, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active.disabled:hover:hover, .datepicker table tr td.active.disabled:hover[disabled], .datepicker table tr td.active.disabled[disabled], .datepicker table tr td.active:active, .datepicker table tr td.active:hover, .datepicker table tr td.active:hover.active, .datepicker table tr td.active:hover.disabled, .datepicker table tr td.active:hover:active, .datepicker table tr td.active:hover:hover, .datepicker table tr td.active:hover[disabled], .datepicker table tr td.active[disabled] {
	background-color: #04c;
}

.datepicker table tr td.active.active, .datepicker table tr td.active.disabled.active, .datepicker table tr td.active.disabled:active, .datepicker table tr td.active.disabled:hover.active, .datepicker table tr td.active.disabled:hover:active, .datepicker table tr td.active:active, .datepicker table tr td.active:hover.active, .datepicker table tr td.active:hover:active {
	background-color: #039\9;
}

.datepicker table tr td span {
	display: block;
	width: 23%;
	height: 54px;
	line-height: 54px;
	float: left;
	margin: 1%;
	cursor: pointer;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.datepicker table tr td span.focused, .datepicker table tr td span:hover {
	background: #eee;
}

.datepicker table tr td span.disabled, .datepicker table tr td span.disabled:hover {
	background: 0 0;
	color: #999;
	cursor: default;
}

.datepicker table tr td span.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active:hover {
	background-color: #006dcc;
	background-image: -moz-linear-gradient(to bottom,#08c,#04c);
	background-image: -ms-linear-gradient(to bottom,#08c,#04c);
	background-image: -webkit-gradient(linear,0 0,0 100%,from(#08c),to(#04c));
	background-image: -webkit-linear-gradient(to bottom,#08c,#04c);
	background-image: -o-linear-gradient(to bottom,#08c,#04c);
	background-image: linear-gradient(to bottom,#08c,#04c);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
	border-color: #04c #04c #002a80;
	border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	color: #fff;
	text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}

.datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled.disabled, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover.disabled, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active.disabled:hover:hover, .datepicker table tr td span.active.disabled:hover[disabled], .datepicker table tr td span.active.disabled[disabled], .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover.disabled, .datepicker table tr td span.active:hover:active, .datepicker table tr td span.active:hover:hover, .datepicker table tr td span.active:hover[disabled], .datepicker table tr td span.active[disabled] {
	background-color: #04c;
}

.datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover:active {
	background-color: #039\9;
}

.datepicker table tr td span.new, .datepicker table tr td span.old {
	color: #999;
}

.datepicker .datepicker-switch {
	width: 145px;
}

.datepicker .datepicker-switch, .datepicker .next, .datepicker .prev, .datepicker tfoot tr th {
	cursor: pointer;
}

.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover, .datepicker tfoot tr th:hover {
	background: #eee;
}

.datepicker .cw {
	font-size: 10px;
	width: 12px;
	padding: 0 2px 0 5px;
	vertical-align: middle;
}

.input-append.date .add-on, .input-prepend.date .add-on {
	cursor: pointer;
}

.input-append.date .add-on i, .input-prepend.date .add-on i {
	margin-top: 3px;
}

.input-daterange input {
	text-align: center;
}

.input-daterange input:first-child {
	-webkit-border-radius: 3px 0 0 3px;
	-moz-border-radius: 3px 0 0 3px;
	border-radius: 3px 0 0 3px;
}

.input-daterange input:last-child {
	-webkit-border-radius: 0 3px 3px 0;
	-moz-border-radius: 0 3px 3px 0;
	border-radius: 0 3px 3px 0;
}

.input-daterange .add-on {
	display: inline-block;
	width: auto;
	min-width: 16px;
	height: 18px;
	padding: 4px 5px;
	font-weight: 400;
	line-height: 18px;
	text-align: center;
	text-shadow: 0 1px 0 #fff;
	vertical-align: middle;
	background-color: #eee;
	border: 1px solid #ccc;
	margin-left: -5px;
	margin-right: -5px;
}

.datepicker.dropdown-menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 1000;
	float: left;
	display: none;
	min-width: 160px;
	list-style: none;
	background-color: #fff;
	border: 1px solid #ccc;
	border: 1px solid rgba(0,0,0,.2);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
	-moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
	box-shadow: 0 5px 10px rgba(0,0,0,.2);
	-webkit-background-clip: padding-box;
	-moz-background-clip: padding;
	background-clip: padding-box;
	border-right-width: 2px;
	border-bottom-width: 2px;
	color: #333;
	font-size: 13px;
	line-height: 20px;
}

.datepicker.datepicker-inline td, .datepicker.datepicker-inline th, .datepicker.dropdown-menu td, .datepicker.dropdown-menu th {
	padding: 4px 5px;
}