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

@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;600;700;800;900&display=swap');


html{scroll-behavior: smooth;}
*{margin: 0; padding: 0;}
body {margin: 0; padding: 0; width: 100%; background: #f5f9e9; height: auto;}
.clearleft{clear: left;}
.clearboth{clear: both;}
.left{float: left;}
.right{float: right;}

p, a, input, select, textarea, ul, li, label{font-family: 'Raleway', sans-serif; font-weight: normal;}
h1, h2, h3, h4, h5, h6{font-family: 'Raleway', sans-serif; font-weight: 700;}
input:focus, select:focus, option:focus {outline: none !important;}

.purple_bg{background: #2a1f2d;}
.blue_bg{background: #1789fc;}

.top_img {height: 200px; width: 100%; position: fixed; background: url('../images/top_img.jpg') no-repeat top center;}
.top_img p{position: absolute; bottom: 0; text-align: center; color: #f5f9e9; font-size: 20px; text-transform: uppercase; font-weight: 400; width: 100%;}

.wrapper{position: absolute; margin-top: 200px;}
.banner{background: url('../images/v_bg.png') top center repeat-y #f5f9e9; width: 100%; text-align: center;}

.banner img{padding: 70px 0 35px 0; max-width: 500px; width: 70%; margin: 0 auto;}

.btns{padding: 65px 0; position: relative; width: 50%; margin: 0 auto;}
.btn{float:left; height: 40px; line-height: 40px; padding: 0 25px; margin:5px; border-radius: 20px; color: #FFF; text-transform: uppercase; font-weight: 700; display: block; text-decoration: none;}
.btn:hover{border-radius: 20px 4px; transition: 0.3s ease;}

.stats{margin: 0 auto; width: 1000px; padding-bottom: 60px;}
.stat{float: left; width: 200px; text-align: center;}
.stat h2{color: #2a1f2d; font-size: 45px; font-weight: 900;}
.stat p{color: #1789fc; font-size: 14px; font-weight: 700;}

.content{position:relative; background: url('../images/content_bg.jpg') repeat-y center center; width: 50%; padding: 70px 25%;}
.content h1{width:100%; font-size: 26px; color: #f5f9e9; text-align: right; font-weight: 400; padding-bottom: 20px;}
.content p{width:100%; font-size: 16px; color: #f5f9e9; text-align: right; font-weight: 400; line-height: 22px;}

.sub_content_plc{width: 100%; background: #f5f9e9; padding: 60px 0;}
.sub_content{margin: 0 auto; padding: 30px 0; max-width: 800px; width: 80%; text-align: center; border-bottom: 1px solid #2a1f2d;}
.sub_content h2{color: #1789fc; font-size: 32px; font-weight: 900; padding: 10px 0;}
.sub_content p{color: #2a1f2d; font-size: 14px; font-weight: 400; text-align: left; line-height: 20px; padding: 5px 0;}
.sub_content ul{list-style: none; padding: 5px 0;}
.sub_content ul li{color: #1789fc; font-size: 14px; font-weight: 400; text-align: left; line-height: 20px; width: 95%; padding-left: 5%;}

.btn2{height: 40px; line-height: 40px; padding: 0 25px; margin:0 5px; border-radius: 20px; color: #FFF; font-weight: 700; display: block; text-decoration: none;}
.btn2:hover{border-radius: 20px 4px; transition: 0.3s ease;}

.footer{position: relative; background: #2a1f2d; width: 100%; padding: 20px 0;}
.footer p{font-size: 12px; color: #f5f9e9; text-align: center; line-height: 18px;}

/*********************** Media Queries **********************/

@media only screen and (max-width: 770px){
	.stats{display: none;}
	.btns{width: 80%;}
}
@media only screen and (max-width: 1080px){
	.stats{display: none;}
}


/*********************** scroll bar **********************/

/* width */
::-webkit-scrollbar {
  width: 14px;
  background: #2a1f2d;
}

/* Track */
::-webkit-scrollbar-track {
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #1789fc; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #FFF; 
}