@import url(https://fonts.googleapis.com/css?family=Lobster|Oswald:400,300|Lobster+Two);


.svgbadge{
	position: relative;
	background-size: 200%;
	background-repeat: no-repeat;
	background-position: top left;
	display: block;
	margin: auto;
}

.svgbadge.xx-small{
	width: 125px;
	height: 125px;
}

.svgbadge.x-small{
	width: 200px;
	height: 200px;
}

.svgbadge.small{
	width: 300px;
	height: 300px;
}

.svgbadge.medium{
	width: 500px;
	height: 500px;
}

.svgbadge.large{
	width: 800px;
	height: 800px;
}

.svgbadge h1, .svgbadge h2{
	text-shadow: 0 0 1px #333;
}

.svgbadge h1{
	color: white;
	text-align: center;
	position: absolute;
	width: 100%;
}

.svgbadge h2{
	color: white;
	text-align: center;
	position: absolute;
	width: 100%;
}

.svgbadge h3{
	color: white;
	text-align: center;
	position: absolute;
	width: 100%;
}

.svgbadge.xx-small h1{
	font-size: 13px;
}

.svgbadge.xx-small h2{
	font-size: 13px;
}
.svgbadge.x-small h1{
	font-size: 23px;
}

.svgbadge.x-small h2{
	font-size: 18px;
}

.svgbadge.small h1{
	font-size: 34px;
}

.svgbadge.small h2{
	font-size: 28px;
}

.svgbadge.medium h1{
	font-size: 60px;
}

.svgbadge.medium h2{
	font-size: 40px;
}

.svgbadge.large h1{
	font-size: 80px;
}

.svgbadge.large h2{
	font-size: 60px;
}

.svgbadge.x-small.shape2:after {
	width: 58%;
	height: 58%;
	display: block;
	border: 1px dashed #FFF;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	position: absolute;
	content: '';
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}
.svgbadge.x-small.shape2:before{
	width: 55%;
	height: 55%;
	display: block;
	border: 1px solid #FFF;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	position: absolute;
	content: '';
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}

.svgbadge.small.shape2:after {
	width: 55%;
	height: 55%;
	display: block;
	border: 1px dashed #FFF;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	position: absolute;
	content: '';
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}
.svgbadge.small.shape2:before{
	width: 53%;
	height: 53%;
	display: block;
	border: 1px solid #FFF;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	position: absolute;
	content: '';
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}

.svgbadge.small.shape3:after{
	width: 57%;
	height: 57%;
	display: block;
	border: 1px dashed #FFF;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	position: absolute;
	content: '';
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}

.svgbadge.medium.shape2:before, .svgbadge.large.shape2:before{
	width: 52%;
	height: 52%;
	display: block;
	border: 1px solid #FFF;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	position: absolute;
	content: '';
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}

.svgbadge.medium.shape2:after, .svgbadge.large.shape2:after{
	width: 55%;
	height: 55%;
	display: block;
	border: 2px dashed #FFF;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	position: absolute;
	content: '';
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}

.svgbadge.medium.shape3:after, .svgbadge.large.shape3:after{
	width: 59%;
	height: 59%;
	display: block;
	border: 2px dotted #FFF;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	position: absolute;
	content: '';
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}

.svgbadge.shape2 h2:before, .svgbadge.shape2 h2:after{
	font-family: var(--font-awesome);
	display: inline-block;
	content: "\f005";
	font-size: 52%;
	line-height: 100%;
	margin: 2px;
	font-weight: 900;
}

.svgbadge.shape2 h1:before{
	content: "";
	display: inline-block;
	border-top: 1px solid #FFF;
	position: absolute;
	margin: auto;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
}

.svgbadge.x-small.shape2 h1:before{
	width: 86px;
}

.svgbadge.small.shape2 h1:before{
	width: 130px;
}

.svgbadge.medium.shape2 h1:before{
	width: 230px;
}

.svgbadge.large.shape2 h1:before{
	width: 350px;
}

.svgbadge.shape6 h1:before, .svgbadge.shape6 h1:after, .svgbadge.shape5 h3:after{
	content: "";
	display: inline-block;
	border-top: 1px solid #FFF;
	position: absolute;
	margin: auto;
}

.svgbadge.shape6 h1:before{
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
}

.svgbadge.shape6 h1:after, .svgbadge.shape5 h3:after{
	left: 0;
	top: 110%;
	bottom: 0;
	right: 0;
}

.svgbadge.xx-small.shape5 h3 {
	display: none;
}

.svgbadge.x-small.shape5 h3 {
    display: none;
}

.svgbadge.small.shape5 h3:after{
	width: 100px;
}

.svgbadge.medium.shape5 h3:after{
	width: 180px;
}

.svgbadge.large.shape5 h3:after{
	width: 250px;
}

.svgbadge.small.shape6 h1:before, .svgbadge.small.shape6 h1:after{
	width: 130px;
}

.svgbadge.medium.shape6 h1:before, .svgbadge.medium.shape6 h1:after{
	width: 230px;
}

.svgbadge.large.shape6 h1:before, .svgbadge.large.shape6 h1:after{
	width: 350px;
}

.svgbadge.small.shape1 h1{
	top:123px;
}

.svgbadge.small.shape1 h2{
	top:80px;
}

.svgbadge.medium.shape1 h1{
	top:200px;
}

.svgbadge.medium.shape1 h2{
	top:150px;
}

.svgbadge.large.shape1 h1{
	top:345px;
}

.svgbadge.large.shape1 h2{
	top:250px;
}

.svgbadge.x-small.shape2 h1{
	top:82px;
}

.svgbadge.x-small.shape2 h2{
	top:53px;
}

.svgbadge.small.shape2 h1{
	top:123px;
}

.svgbadge.small.shape2 h2{
	top:80px;
}
.svgbadge.medium.shape2 h1{
	top:200px;
}

.svgbadge.medium.shape2 h2{
	top:150px;
}

.svgbadge.large.shape2 h1{
	top:345px;
}

.svgbadge.large.shape2 h2{
	top:250px;
}

.svgbadge.small.shape3 h1{
	top:105px;
}

.svgbadge.medium.shape3 h1{
	top:170px;
}

.svgbadge.large.shape3 h1{
	top:290px;
}

.svgbadge.small.shape4 h1{
	top:113px;
}

.svgbadge.small.shape4 h2{
	top:190px;
	font-size: 20px;
}

.svgbadge.medium.shape4 h1{
	top:190px;
}

.svgbadge.medium.shape4 h2{
	top:320px;
	font-size: 32px;
}

.svgbadge.large.shape4 h1{
	top:320px;
}

.svgbadge.large.shape4 h2{
	top:500px;
}

.svgbadge.xx-small.shape5 h1{
	top:30px;
}

.svgbadge.xx-small.shape5 h2{
	top:53px;
}

.svgbadge.x-small.shape5 h1{
	top:62px;
}

.svgbadge.x-small.shape5 h2{
	top:97px;
}

.svgbadge.small.shape5 h1 {
	top:100px;
}

.svgbadge.small.shape5 h2 {
	top:139px;
	font-size: 17px;
}

.svgbadge.small.shape5 h2{
	top:160px;
	font-size: 20px;
}
.svgbadge.small.shape5 h3{
	top:70px;
	font-size: 14px;
}

.svgbadge.medium.shape5 h1{
	top:160px;
}

.svgbadge.medium.shape5 h2{
	top:255px;
}

.svgbadge.medium.shape5 h3{
	top:130px;
}

.svgbadge.large.shape5 h1{
	top:280px;
}

.svgbadge.large.shape5 h2{
	top:415px;
}
.svgbadge.large.shape5 h3{
	top:210px;
}


.svgbadge.small.shape6 h1{
	top:100px;
}

.svgbadge.small.shape6 h2{
	top:160px;
	font-size: 20px;
}
.svgbadge.small.shape6 h3{
	top:70px;
	font-size: 14px;
	width: 100%;
}

.svgbadge.medium.shape6 h1{
	top:160px;
}

.svgbadge.medium.shape6 h2{
	top:255px;
}

.svgbadge.medium.shape6 h3{
	top:130px;
}

.svgbadge.large.shape6 h1{
	top:280px;
}

.svgbadge.large.shape6 h2{
	top:415px;
}
.svgbadge.large.shape6 h3{
	top:250px;
}

.svgbadge.small.shape7 h1, .svgbadge.small.shape8 h1, .svgbadge.small.shape9 h1, .svgbadge.small.shape10 h1, .svgbadge.small.shape11 h1{
	top:95px;
	text-transform: uppercase;
}

.svgbadge.small.shape7 h2, .svgbadge.small.shape8 h2, .svgbadge.small.shape9 h2, .svgbadge.small.shape10 h2, .svgbadge.small.shape11 h2{
	top:155px;
	font-size: 20px;
}
.svgbadge.small.shape7 h3, .svgbadge.small.shape8 h3, .svgbadge.small.shape9 h3, .svgbadge.small.shape10 h3, .svgbadge.small.shape11 h3{
	top:85px;
	font-size: 14px;
}

.svgbadge.shape10 h1:before, .svgbadge.shape10 h1:after,
.svgbadge.shape11 h1:before, .svgbadge.shape11 h1:after{
	position: relative;
	font-family: var(--font-awesome);
	display: inline-block;
	content: "\f004";
	font-size: 70%;
	margin: 0 5px;
	top: -5px;
}


.svgbadge.shape7 h3, .svgbadge.shape8 h3, .svgbadge.shape9 h3, .svgbadge.shape10 h3, .svgbadge.shape11 h3{
	left: 0;
	right: 0;
	width: 100px;
	margin: 5px auto !important;
	border-bottom: 1px dashed;
}


.svgbadge.medium.shape7 h1, .svgbadge.medium.shape8 h1, .svgbadge.medium.shape9 h1, .svgbadge.medium.shape10 h1, .svgbadge.medium.shape11 h1{
	top:155px;
	text-transform: uppercase;
}

.svgbadge.medium.shape7 h2, .svgbadge.medium.shape8 h2, .svgbadge.medium.shape9 h2, .svgbadge.medium.shape10 h2, .svgbadge.medium.shape11 h2{
	top:265px;
	font-size: 28px;
}

.svgbadge.medium.shape7 h3, .svgbadge.medium.shape8 h3, .svgbadge.medium.shape9 h3, .svgbadge.medium.shape10 h3, .svgbadge.medium.shape11 h3{
	top:130px;
}


.svgbadge.large.shape7 h1, .svgbadge.large.shape8 h1, .svgbadge.large.shape9 h1, .svgbadge.large.shape10 h1, .svgbadge.large.shape11 h1{
	text-transform: uppercase;
	top:275px;
}

.svgbadge.large.shape7 h2, .svgbadge.large.shape8 h2, .svgbadge.large.shape9 h2, .svgbadge.large.shape10 h2, .svgbadge.large.shape11 h2{
	top:425px;
	font-size: 34px;
}

.svgbadge.large.shape7 h3, .svgbadge.large.shape8 h3, .svgbadge.large.shape9 h3, .svgbadge.large.shape10 h3, .svgbadge.large.shape11 h3{
	top:220px;
}


.svgbadge.shape1.blue, .svgbadge.shape1.green, .svgbadge.shape1.dark, .svgbadge.shape1.orange{
	background-image: url(../svg/badges-01.svg);
}

.svgbadge.shape2.blue, .svgbadge.shape2.green, .svgbadge.shape2.dark, .svgbadge.shape2.orange{
	background-image: url(../svg/badges-02.svg);
}

.svgbadge.shape3.blue, .svgbadge.shape3.green, .svgbadge.shape3.dark, .svgbadge.shape3.orange{
	background-image: url(../svg/badges-03.svg);
}

.svgbadge.shape4.blue, .svgbadge.shape4.green, .svgbadge.shape4.dark, .svgbadge.shape4.orange{
	background-image: url(../svg/badges-04.svg);
}

.svgbadge.shape5.blue, .svgbadge.shape5.green, .svgbadge.shape5.dark, .svgbadge.shape5.orange{
	background-image: url(../svg/badges-05.svg);
}

.svgbadge.shape6.blue, .svgbadge.shape6.green, .svgbadge.shape6.dark, .svgbadge.shape6.orange{
	background-image: url(../svg/badges-06.svg);
}

.svgbadge.shape7.blue, .svgbadge.shape7.green, .svgbadge.shape7.dark, .svgbadge.shape7.orange{
	background-image: url(../svg/badges-07.svg);
}

.svgbadge.shape8.blue, .svgbadge.shape8.green, .svgbadge.shape8.dark, .svgbadge.shape8.orange{
	background-image: url(../svg/badges-08.svg);
}

.svgbadge.shape9.blue, .svgbadge.shape9.green, .svgbadge.shape9.dark, .svgbadge.shape9.orange{
	background-image: url(../svg/badges-09.svg);
}

.svgbadge.shape10.blue, .svgbadge.shape10.green, .svgbadge.shape10.dark, .svgbadge.shape10.orange{
	background-image: url(../svg/badges-10.svg);
}

.svgbadge.shape11.blue, .svgbadge.shape11.green, .svgbadge.shape11.dark, .svgbadge.shape11.orange{
	background-image: url(../svg/badges-11.svg);
}

.svgbadge.shape7 h1, .svgbadge.shape7 h2, .svgbadge.shape7 h3,
.svgbadge.shape8 h1, .svgbadge.shape8 h2, .svgbadge.shape8 h3,
.svgbadge.shape9 h1, .svgbadge.shape9 h2, .svgbadge.shape9 h3,
.svgbadge.shape10 h1, .svgbadge.shape10 h2, .svgbadge.shape10 h3{
	text-shadow: none;
}


.svgbadge.shape7.blue h1, .svgbadge.shape7.blue h2, .svgbadge.shape7.blue h3,
.svgbadge.shape8.blue h1, .svgbadge.shape8.blue h2, .svgbadge.shape8.blue h3,
.svgbadge.shape9.blue h1, .svgbadge.shape9.blue h2, .svgbadge.shape9.blue h3{
	color: #00a1b3;
}

.svgbadge.shape7.green h1, .svgbadge.shape7.green h2, .svgbadge.shape7.green h3,
.svgbadge.shape8.green h1, .svgbadge.shape8.green h2, .svgbadge.shape8.green h3,
.svgbadge.shape9.green h1, .svgbadge.shape9.green h2, .svgbadge.shape9.green h3{
	color: #41b878;
}

.svgbadge.shape7.dark h1, .svgbadge.shape7.dark h2, .svgbadge.shape7.dark h3,
.svgbadge.shape8.dark h1, .svgbadge.shape8.dark h2, .svgbadge.shape8.dark h3,
.svgbadge.shape9.dark h1, .svgbadge.shape9.dark h2, .svgbadge.shape9.dark h3{
	color: #1c2e42;
}

.svgbadge.shape7.orange h1, .svgbadge.shape7.orange h2, .svgbadge.shape7.orange h3,
.svgbadge.shape8.orange h1, .svgbadge.shape8.orange h2, .svgbadge.shape8.orange h3,
.svgbadge.shape9.orange h1, .svgbadge.shape9.orange h2, .svgbadge.shape9.orange h3{
	color: #f37947;
}

.svgbadge.shape1 h1{
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	font-weight: 300;
}

.svgbadge.shape1 h2{
	font-family: 'Lobster', cursive;
}

.svgbadge.shape2 h1{
	font-family: 'Lobster', cursive;
}

.svgbadge.shape2 h2{
	font-family: 'Oswald', sans-serif;	
	font-weight: 300;
}

.svgbadge.shape3 h1{
	font-family: 'Lobster', cursive;
	-ms-transform: rotate(-30deg); /* IE 9 */
	-webkit-transform: rotate(-30deg); /* Chrome, Safari, Opera */
	transform: rotate(-30deg);
}

.svgbadge.green{
	background-position: left top;
}
.svgbadge.blue{
	background-position: right top;
}
.svgbadge.orange{
	background-position: right bottom;
}
.svgbadge.dark{
	background-position: left bottom;
}


.svgbadge.shape4 h1{
	font-family: 'Lobster', cursive;
	-ms-transform: rotate(-28deg); /* IE 9 */
	-webkit-transform: rotate(-28deg); /* Chrome, Safari, Opera */
	transform: rotate(-28deg);
}

.svgbadge.shape4 h2{
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;	
}



.svgbadge.shape5 h1{
	font-family: 'Lobster', cursive;
}

.svgbadge.shape5 h2{
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;	
}

.svgbadge.shape5 h3{
	font-family: 'Lobster Two', cursive;
}


.svgbadge.shape6 h1{
	font-family: 'Lobster', cursive;
}

.svgbadge.shape6 h2{
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;	
}

.svgbadge.shape6 h3{
	font-family: 'Lobster Two', cursive;
}