@charset "utf-8";
/*************** FONTS ***************/
@font-face {
	font-family: 'Conv_FontsFree-Net-ProximaNovaAltRegular';
	src: url('../fonts/FontsFree-Net-ProximaNovaAltRegular.eot');
	src: url('../fonts/FontsFree-Net-ProximaNovaAltRegular.woff') format('woff'), 
	url('../fonts/FontsFree-Net-ProximaNovaAltRegular.ttf') format('truetype'), 
	url('../fonts/FontsFree-Net-ProximaNovaAltRegular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Conv_Proxima Nova Alt Bold';
	src: url('../fonts/Proxima Nova Alt Bold.eot');
	src: url('../fonts/Proxima Nova Alt Bold.woff') format('woff'), 
	url('../fonts/Proxima Nova Alt Bold.ttf') format('truetype'), 
	url('../fonts/Proxima Nova Alt Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Conv_Proxima Nova Alt Semibold';
	src: url('../fonts/Proxima Nova Alt Semibold.eot');
	src: url('../fonts/Proxima Nova Alt Semibold.woff') format('woff'), 
	url('../fonts/Proxima Nova Alt Semibold.ttf') format('truetype'), 
	url('../fonts/Proxima Nova Alt Semibold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Conv_Proxima Nova Alt Light';
	src: url('../fonts/Proxima Nova Alt Light.eot');
	src: url('../fonts/Proxima Nova Alt Light.woff') format('woff'), 
	url('../fonts/Proxima Nova Alt Light.ttf') format('truetype'), 
	url('../fonts/Proxima Nova Alt Light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Conv_Proxima Nova Alt Thin';
	src: url('../fonts/Proxima Nova Alt Thin.eot');
	src: url('../fonts/Proxima Nova Alt Thin.woff') format('woff'), 
	url('../fonts/Proxima Nova Alt Thin.ttf') format('truetype'), 
	url('../fonts/Proxima Nova Alt Thin.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

/*************** DEFAULT CSS ***************/
body{
 	font-family: 'Conv_Proxima Nova Alt Thin';
 	font-size: 18px;
 	font-style: normal;
 	line-height: normal;
 	font-weight: inherit;
 	color: #656565;
 	text-decoration: none;
 	margin:0px;
 	-webkit-font-smoothing: antialiased;
 	padding:0;
}
* {
    -webkit-box-sizing: border-box;
    -mox-box-sizing: border-box;
    box-sizing: border-box;
}
::selection {
    background: #fff; /* Safari */
	color:#000;
        }
::-moz-selection {
    background: #fff; /* Firefox */
	color:#000;
}
a {
	color:#000;
	text-decoration: none;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
	}
	a:hover {
	color: #666666;
    }
p {
	margin:0 0 30px 0;
	clear:left;
	padding:0;
	}
h1, h2, h3, h4, h5, h6 {
	margin:0 0 20px 0;
	padding:0;
	font-weight: 300;
	color:#666666;
	}	
hr {
	margin:40px  0 60px 0;
	height:1px;
	border:0;
	border-top:1px solid #c1c1c1;
	border-bottom:1px solid #c1c1c1;
	float:left;
	width:100%;
	position:relative;
}
img{
	border:0;
}	
a img {
	border: 0;
	}

/*************** PRELOADER ***************/
#preloader {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#fff; /* change if the mask should have another color then white */
	z-index:999999; /* makes sure it stays on top */
}
#status {
	width:234px;
	height:55px;
	position:absolute;
	left:50%; /* centers the loading animation horizontally one the screen */
	top:50%; /* centers the loading animation vertically one the screen */
	background-image:url(../images/ston-logo.png); /* path to your loading animation */
	background-repeat:no-repeat;
	background-position:center;
	margin:-27.5px 0 0 -117px; /* is width and height divided by two */
}

/*************** BACK TO TOP ***************/
#fixed-bar {
   
    z-index: 100;
	width:46px;
	height:50px;
	position:absolute;
	bottom:80px;
	right:20px;
	margin-bottom:5px;

}
#fixed-bar a {
	width:46px;
	height:50px;
	float:right;
	display:block;
	background-image: url(../images/top.png);
	background-repeat: no-repeat;
	background-position: center center;
	border:2px solid #5b5a57;
	text-indent:-9999px;
}
#fixed-bar a:hover {}		
	
/*************** COLUMS AND ROWS ***************/
main{
    position:relative;
	}
row{
	width:100%;
	display:block;
	float:left;
	margin:0 0 30px 0;
	padding:0;
}
clearfix{
	width:100%;
	height:100px;
	float:left;
	margin:0;
	padding:0;
	display:block;
}
.container{
	width:80%;
	margin:0 auto;
}
.fullwidth{
	width:100%;
	display:block;
}
clearfix{
	width:100%;
	height:100px;
	float:left;
	margin:0;
	padding:0;
	display:block;
}
.two-col{
	width: 46%;
    float: left;
    margin-right: 8%;
}
.three-col{
	width:30%;
	float:left;
	margin-right:5%;
}
.four-col{
	width:22%;
	float:left;
	margin-right:4%;
}
.last{
	margin-right:0;
}
section {
	width: 100%;
	float: left;
	position: relative;
}
aside {
    width: 25%;
    float: left;
    margin: 0;
    padding: 0;
}
summary {
    width: 70%;
    float: right;
    margin: 0;
    padding: 0;
}
.text-center{
	text-align:center;
	}
.pad{ 
    padding:60px 0px;
	}
.m-b-60{ margin-bottom:60px;}
.pad-lr-15{ padding:0 15px;}

/*************** HOME PAGE CSS ***************/
header{ float:left; width:100%; top:-200px; -webkit-transition: all 800ms ease-in-out;-moz-transition: all 800ms ease-in-out;transition: all 800ms ease-in-out; padding:40px 70px;}
.menu{ float:left;}
.logo{ float:right;}
.intro{ padding:100px 0 60px;}
.intro p{font-size: 32px;}
.left-img{ float:left; width:42%;}
.right-content{ float:left; width:60%; padding: 0 200px;}
.section-wrap{ display: flex; justify-content: center; align-items: center; }
.heading{display:block;font-size:72px;}
.sub-tittle{display:block; font-size:22px; font-family: 'Conv_Proxima Nova Alt Light'; margin-bottom: 30px;}
.read-more{}
.read-more a{display:inline-block;background-color:#333333;font-size:24px;color:#fff;padding: 10px 30px;letter-spacing: 2px;}
.read-more a:hover{ background-color:#080808;}
.left-content{float:left;width: 38%;padding-right: 92px;}
.right-img{ float:left;width: 62%;}
.for-you{ display: flex; justify-content: center; align-items: center; padding-left:40px; padding-right:40px; padding-bottom:100px}
.for-you .read-more{ position:absolute; z-index:3;}
.for-you .read-more a{ background-color:#000;}
.for-you .read-more a:hover{ background-color:#333333}
footer{ float:left; width:100%; text-align:center;}
.ftr-contact{display:block;margin-bottom: 50px;}
.ftr-contact a{display:inline-block;width: 64px;height: 64px;background-color:#666666;text-align:center;line-height: 66px;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;font-size: 28px;color: #fff;margin:0 10px;}
.ftr-contact a:hover{ background-color:#000; color:#fff;}
.subscribe-head{display:block;font-size: 38px;margin-bottom: 50px;color: #000;}
.subscribe-email{ display:inline-block; width:50%; margin-bottom: 55px;}
social{ display:block; text-align:center; margin-bottom:30px;}
social a{text-transform:uppercase;font-size: 18px;color: #000000;margin: 0 15px;letter-spacing: 2px;}
social a:hover{ color:#000;}
.ftr-links{ display:block; margin-bottom:55px;}
.ftr-links a{display:inline-block;margin:0px 10px;color: #000000;letter-spacing: 1px;font-size: 16px;}
.ftr-links a:hover{ color:#000}
.copyright{color: #000000;}

/*************** INNER PAGE CSS ***************/
.three-box{ float:left; width:33.333333333%; padding:0 15px; margin:0 0 30px;}
.two-box{ float:left; width:50%; padding:0 15px; margin:0 0 30px;}
.text-darck{ color:#333333;}
.sub-heading{ display: block; font-size: 70px; line-height: normal; margin-bottom: 25px;}
.sub-heading span{ font-weight:500;}
.sub-heading-one{ display:block; font-size: 46px; line-height:normal;}
.style-box{display:block;text-align:center;margin: 0 auto 22px;width:35%;}
.style-box h3{ font-size: 24px; line-height: normal;}
.style-box h5{ font-size: 25px; margin-bottom: 5px;}
.style-box h2{ line-height:normal;}
.form-wrap{ float:left; width:100%; padding:50px; border:1px solid #333333;}
.radio-section{ float: left; width: 100%; border-bottom: 1px solid #a0a0a0; margin-bottom: 25px; padding-bottom: 15px;}
.two-line-section{ float: left; width: 100%; border-bottom: 1px solid #a0a0a0; padding-bottom: 40px; margin-bottom: 20px;}
.two-lines{ float:left; width:18%; }
.two-lines .radio-btn{ width: 100%;}

/********* fixed header ***************/
header.smaller{ position: fixed; -webkit-transition: all 800ms ease-in-out;-moz-transition: all 800ms ease-in-out;transition: all 800ms ease-in-out;top: 0;z-index: 9;background-color: #fff;box-shadow: 0px 1px 28px #00000038; padding:10px 70px}
header.smaller .logo{ margin-top:15px;}
header.smaller .logo img{ width: 140px;}


/*************** hover style ***************/
.hover-style{ width:100%; float:left; position:relative; overflow:hidden; -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;     line-height: 0px;}
.hover-style::before, .hover-style:after { position: absolute; top: 10px; right: 10px; bottom: 10px; left: 10px; content: ''; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; z-index:3 !important;}
.hover-style::before { border-top: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: scale(0,1); transform: scale(0,1);}
.hover-style::after { border-right: 1px solid #fff; border-left: 1px solid #fff; -webkit-transform: scale(1,0); transform: scale(1,0);}
.hover-style:hover::before, .hover-style:hover::after { opacity: 1; -webkit-transform: scale(1); transform: scale(1);}
.hover-style img { position: relative; width:100%; transition: 0.5s ease; -o-transition: 0.5s ease; -webkit-transition: 0.5s ease;}
.hover-style:hover img { -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -o-transform:scale(1.1); -ms-transform:scale(1.1); transform:scale(1.1);}

/**********forms**************/
form{
	margin:0;
	padding:0;
}
*:focus {  
	outline: none;
}
.fieldset{
	width:100%;
	height:auto;
	padding: 16px 10px;
	background-color:transparent;
	display:block;
	border: none;
	border-bottom: 2px solid #1d1d1b;
	margin:0 0 10px 0;
	color: #000000;
	font-size: 20px;
	float:left;
	font-weight: 300;
	text-align: center;
	font-family: 'Raleway', sans-serif;
}

.sendbutton{
	width:auto;
	height:auto;
	border:0;
	outline:0;
	margin:0 5px 0 0;
	float:left;
	color:#fff;
	font-size:20px;
	cursor:pointer;
	vertical-align:top;
	padding:10px 20px;
	text-align:center;
	background-color:#00BFF3;
	text-transform:uppercase;
	}
.sendbutton:hover{
	background-color:#1442A2;
	color:#fff;
	}
	
/* The container */
.radio-btn {
  float:left;
  position: relative;
  padding-left: 19px;
  margin-bottom: 10px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  color: #696969;
  margin-right: 15px;
  line-height: 15px;
}

/* Hide the browser's default checkbox */
.radio-btn input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 12px;
  width: 12px;
  /* background-color: #eee; */
  border:1px solid #b3b3b3;
}

/* On mouse-over, add a grey background color */
.radio-btn:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.radio-btn input:checked ~ .checkmark {
  background-color: #000000;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.radio-btn input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.radio-btn .checkmark:after {
  /* left: 3px; */
  /* top: 1px; */
  /* width: 4px; */
  /* height: 7px; */
  /* border: solid black; */
  /* border-width: 0 2px 2px 0; */
  /* -webkit-transform: rotate(45deg); */
  -ms-transform: rotate(45deg);
  /* transform: rotate(45deg); */
}	
.radio-btn-big{ font-size:22px; display:block;     margin-bottom: 20px;}	
.radio-btn-big .checkmark { height: 20px; width: 20px;}
.radio-btn-big {padding-left: 28px;line-height: 20px;}
.radio-btn-big .checkmark:after { left: 6px; top: 2px; width: 4px; height: 10px;}

	
::-webkit-input-placeholder {
   color: #868686 !important;
}
:-moz-placeholder { /* Firefox 18- */
   color: #868686 !important;
}
::-moz-placeholder {  /* Firefox 19+ */
   color: #868686 !important;
}
:-ms-input-placeholder {  
   color:#868686 !important;
}

/************************************* 1366px *************************************/
@media only screen and (max-width: 1366px) {
.right-content { padding: 0 110px;}
}

/************************************* 1180px *************************************/
@media only screen and (max-width: 1180px) {
.container{ width:96%;}
.logo, .menu { width: 100%; text-align: center;}
header{ padding: 15px 30px;}
header.smaller .logo { margin-top: 0;}
}

/************************************* 1024px *************************************/
@media only screen and (max-width: 1024px) {
.container{ width:90%;}
.ftr-links a { margin: 0px 7px; letter-spacing: 0;}
.subscribe-email { width: 100%;}
}

/************************************* 980px *************************************/
@media only screen and (max-width: 980px) {
header {padding: 20px 30px 14px;}
.logo {margin-bottom: 6px;float: left;width: auto;text-align: left;}
.logo a img{width: 156px;}
header.smaller { padding:10px 30px 0;}
}

/************************************* 800px *************************************/
@media only screen and (max-width: 800px) {
.right-content { padding: 0 30px;}
.right-content { padding: 0 30px;}
.heading{ margin-bottom:22px;}
.sub-tittle, .m-b-60 { margin-bottom: 30px;}
.heading { font-size: 52px;}
.two-lines { width: 50%;}
}

/************************************* 767px *************************************/
@media only screen and (max-width: 768px) {
.intro { padding: 60px 0 20px;}
.section-wrap { display: inherit;}
.pad{ padding:30px 0px;}
.intro p { font-size: 22px; line-height: 30px;}
.left-img, .right-content, .left-content, .right-img{ width:100%; padding:0px}
.left-content{ margin-bottom:20px;}
}

/************************************* 640px *************************************/
@media only screen and (max-width: 640px) {
.two-col, .three-col, .four-col, aside, summary{ width:100%; margin:0 0 25px 0; }
.logo img{ width: 120px;}
header{ -webkit-transition: all 0ms ease-in-out;-moz-transition: all 0ms ease-in-out; transition: all 0ms ease-in-out; padding: 15px 10px 0;}
header.smaller{ position:relative; -webkit-transition: all 0ms ease-in-out;-moz-transition: all 0ms ease-in-out; transition: all 0ms ease-in-out;}
social a { margin: 8px 0;  display: block;}
.subscribe-email { margin-bottom: 30px;}
.style-box { width: 100%;}
}

/************************************* 480px *************************************/
@media only screen and (max-width: 480px) {
.container{ width:90%; }

}

/************************************* 450px *************************************/
@media only screen and (max-width: 450px) {
.two-lines{ width:100%; margin-bottom: 30px;}	
}

/************************************* 320px *************************************/
@media only screen and (max-width: 320px) {

}