@import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&family=Catamaran:wght@100;200;400;500;700;800;900&family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Zilla+Slab:wght@700&display=swap');



body{

  background-image: url(https://hellorates.com/wp-content/uploads/2022/06/hellorates_BG.svg) !important;

  background-repeat: no-repeat !important;

  background-size: cover !important;

  background-color: transparent !important;

}



html {

  box-sizing: border-box;

}

*, *:before, *:after {

  box-sizing: inherit;

}



article, header, section, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {

    display: block;

}

body {

    background:#e2f2f7 none repeat scroll 0 0;

    color: #222;

    font-size: 100%;

    line-height: 24px;

    margin: 0;

	padding:0;

	font-family: 'Poppins';

}

a{

	font-family: 'Poppins';

	text-decoration: none;

	outline: none;

}

a:hover, a:focus {

	color: #373e18;

}

section {

    float: left;

    width: 100%;

	padding-bottom:3em;

}

h2 {

    color: #1a0e0e;

    font-size: 26px;

    font-weight: 700;

    margin: 0;

    line-height: normal;

	text-transform:uppercase;

}

h2 span {

    display: block;

    padding: 0;

    font-size: 18px;

    opacity: 0.7;

    margin-top: 5px;

	text-transform:uppercase;

}



#float-right{

	float:right;	

}



/* ******************************************************

	Script Top

*********************************************************/



.ScriptTop {

    background: #fff none repeat scroll 0 0;

    float: left;

    font-size: 0.69em;

    font-weight: 600;

    line-height: 2.2;

    padding: 12px 0;

    text-transform: uppercase;

    width: 100%;

}



/* To Navigation Style 1*/

.ScriptTop ul {

    margin: 24px 0;

    padding: 0;

    text-align: left;

}

.ScriptTop li{

	list-style:none;	

	display:inline-block;

}

.ScriptTop li a {

    background: #6a4aed none repeat scroll 0 0;

    color: #fff;

    display: inline-block;

    font-size: 14px;

    font-weight: 600;

    padding: 5px 18px;

    text-decoration: none;

    text-transform: capitalize;

}

.ScriptTop li a:hover{

	background:#000;

	color:#fff;

}





/* ******************************************************

	Script Header

*********************************************************/



.ScriptHeader {

    float: left;

    width: 100%;

    padding: 2em 0;

}

.rt-heading {

    margin: 0 auto;

	text-align:center;

}

.Scriptcontent{

	line-height:28px;	

}

.ScriptHeader h1{

	font-family: "brandon-grotesque", "Brandon Grotesque", "Source Sans Pro", "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif;

  text-rendering: optimizeLegibility;

  -webkit-font-smoothing: antialiased;

    color: #6a4aed;

    font-size: 26px;

    font-weight: 700;

    margin: 0;

    line-height: normal;



}

.ScriptHeader h2 {

    color: #312c8f;

    font-size: 20px;

    font-weight: 400;

    margin: 5px 0 0;

    line-height: normal;



}

.ScriptHeader h1 span {

    display: block;

    padding: 0;

    font-size: 22px;

    opacity: 0.7;

    margin-top: 5px;



}

.ScriptHeader span {

    display: block;

    padding: 0;

    font-size: 22px;

    opacity: 0.7;

    margin-top: 5px;

}









/* ******************************************************

	Live Demo

*********************************************************/











/* ******************************************************

	Responsive Grids

*********************************************************/



.rt-container {

	margin: 0 auto;

	padding-left:12px;

	padding-right:12px;

}

.rt-row:before, .rt-row:after {

  display: table;

  line-height: 0;

  content: "";

}



.rt-row:after {

  clear: both;

}

[class^="col-rt-"] {

  box-sizing: border-box;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -o-box-sizing: border-box;

  -ms-box-sizing: border-box;

  padding: 0 15px;

  min-height: 1px;

  position: relative;

}





@media (min-width: 768px) {

  .rt-container {

    width: 750px;

  }

  [class^="col-rt-"] {

    float: left;

    width: 49.9999999999%;

  }

  .col-rt-6, .col-rt-12 {

    width: 100%;

  }

  

}



@media (min-width: 1200px) {

	.rt-container {

		width: 1170px;

	}

	.col-rt-1 {

		width:16.6%;

	}

	.col-rt-2 {

		width:30.33%;

	}

	.col-rt-3 {

		width:50%;

	}

	.col-rt-4 {

		width: 67.664%;

	}

	.col-rt-5 {

		width: 83.33%;

	}

	



}



@media only screen and (min-width:240px) and (max-width: 768px){

	 .ScriptTop h1, .ScriptTop ul {

		text-align: center;

	}

	.ScriptTop h1{

		margin-top:0;

		margin-bottom:15px;

	}

	.ScriptTop ul{

		 margin-top:12px;		

	}

	

	.ScriptHeader h1,

	.ScriptHeader h2, 

	.scriptnav ul{

		text-align:center;	

	}

	.scriptnav ul{

		 margin-top:12px;		

	}

	#float-right{

		float:none;	

	}

	

}

@media (max-width: 399px){

  #canvas{width: 180px !important;

      height: 180px !important;

      display: flex !important;}

}