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

@import url("https://fonts.googleapis.com/css?family=Sen&display=swap");	
 
/*default css - add exception within media query*/ 

div.carebord {width: 100%; 
	padding: 1em; 
	padding-right: 1.5em; 
	padding-bottom: 1.75em; 
	border: #005496 solid 2px; 
	display: flow-root;
/*	background-image: url("https://www.worldwidepetcare.com/images/dogs-and-cats-space-world-lite.webp");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: bottom center;*/
}

p {color: #000; font-family: Calibri, Arial, Helvetica, sans-serif; font-size: 18px; line-height: 1.4em; max-width: 100%; margin-bottom: .5em;} 


p.bfwht a.navbarbut1 {
    font-size: 1.3em!important;
	font-family: Calibri, Arial, Helvetica, sans-serif;
	font-weight: 700!important;
	width: 90%;
    margin-bottom: 0em;
    padding-top: .2em;
	/*height: 1.3em;*/
	/*left: 5%;*/
	display: inline-block;
    padding: .2em 0 4px 0px;
    background-color: transparent;
    color: #fff;
	border-style: none!important;
	border: 0 solid transparent;
    cursor: pointer;
    /*transition: background .5s ease-in-out;*/
	position: absolute;
	z-index: 1000;
	outline: none;
}


p.bfwht a.navbarbut1:hover {/*left: 5%;*/ font-weight: 700; width: 90%; height: 1.3em; color: #beebf7; background-color: transparent; border: 0 solid transparent; border-radius: none!important; padding: .2em 0 4px -2px; margin-bottom: 1em; display: inline-block; position: absolute; z-index:1000}


button.catOCbuthldr {
	font-family: 'Oswald', 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow'!important;
		font-size: 1.5em; 
		line-height: 1.4em;
		font-weight: 400;
		color: #36c;
		background-color: #fff;
		border-radius: 6px; 
		border-color: #36c!important; 		
		cursor: pointer;
		padding: 4px;
		position: relative;
		} 	

button.catOCbuthldr:hover {
	font-family: 'Oswald', 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow'!important;
		font-size: 1.5em; 
		line-height: 1.4em;
		font-weight: 400;
		color: #c00;
		background-color: #fff;
		border-radius: 6px;
		border-color: #c00!important;  
		cursor: pointer;
		padding: 4px;
		} 

button.catOCbuthldr:hover #opnclshldr {
		background-color: #c00!important;
		top:-3px;
		height:auto;
		padding: 0 8px;
		z-index:1000;
		} 

button.catOCbuthldr span#opnclshldr {
	font-family: 'Oswald', 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow'!important;
		font-size: .7em; 
		line-height: .6em;
		background-color: #36c!important;
		border-radius: 6px;
		cursor: pointer;
		color: #fff;
		top:-3px;
		height:auto;
		width: auto;
		padding: 0 8px;
		white-space:nowrap; margin-left: 20px;
		z-index:1000;
		position: relative;
		} 

button.catOCbuthldr span#opnclshldr:hover  {
		background-color: #c00!important;
		top:-3px;
		height:auto;
		padding: 0 8px;
		z-index:1000;
}

/*FEATURES & BENEFITS*/

button.catOCbuthldr1 {
	font-family: 'Oswald', 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow'!important;
		font-size: 1.5em; 
		line-height: 1.4em;
		font-weight: 400;
		color: #36c;
		background-color: #fff;
		border-radius: 6px; 
		border-color: #36c!important; 		
		cursor: pointer;
		padding: 4px;
		position: relative;
		} 	

button.catOCbuthldr1:hover {
	font-family: 'Oswald', 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow'!important;
		font-size: 1.5em; 
		line-height: 1.4em;
		font-weight: 400;
		color: #c00;
		background-color: #fff;
		border-radius: 6px;
		border-color: #c00!important;  
		cursor: pointer;
		padding: 4px;
		} 

button.catOCbuthldr1:hover #opnclshldr1 {
		background-color: #c00!important;
		top:-3px;
		height:auto;
		padding: 0 8px;
		z-index:1000;
		} 

button.catOCbuthldr1 span#opnclshldr1 {
	font-family: 'Oswald', 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow'!important;
		font-size: .7em; 
		line-height: .6em;
		background-color: #36c!important;
		border-radius: 6px;
		cursor: pointer;
		color: #fff;
		top:-3px;
		height:auto;
		width: auto;
		padding: 0 8px;
		white-space:nowrap; margin-left: 20px;
		z-index:1000;
		position: relative;
		} 

button.catOCbuthldr1 span#opnclshldr1:hover  {
		background-color: #c00!important;
		top:-3px;
		height:auto;
		padding: 0 8px;
		z-index:1000;
}


/*END*/

button.catOCbut1 {
		font-family: 'Oswald', 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow';
		font-size: 1.1em; 
		line-height: 1.1em;
		color: #fff;
		background-color: #36c;
		border-radius: 6px; 
		cursor: pointer;
		} 	
/*button.catOCbut span#opncls {font-family: 'Oswald', 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow';
		font-size: .9em; 
		color: #fff;
		width: auto;
		white-space:nowrap; margin-left: 20px;}	*/
button.catOCbut1 span#opncls1{font-family: 'Oswald', 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow';
		font-size: .9em; 
		color: #fff;
		width: auto;
		white-space:nowrap; margin-left: 20px;}		
	
	
button.catOCbut:hover {background-color: #c00;}
button.catOCbuthldr:hover #opnclshldr{background-color: #c00;}
button.catOCbut1:hover {background-color: #c00;}

div#oneA{top: 6px; left: 5.5%; position: absolute; white-space: nowrap!important; float: left;} 
#opncls1{white-space:nowrap; position: relative; margin-top:-30px; margin-left: 160px;}		
div#twoA{top: 6px; left: 52%; position: absolute; white-space: nowrap!important; float: left;}
.twoAFB {left: 4.5%;}

section#one {width: 95%; float: left; margin-right: 1%;}
section#two {width: 95%; float: left;} 

/*CONTROLLED WITHIN SCRIPTS*/
/*Left Side*/
.slide-elementL {
  /* Initial state: hidden and positioned off-screen */
  transform: translateX(1.5%); /* or translateY for vertical slide */
  opacity: 1;
  visibility: visible; /* Helps prevent interaction when hidden */
  transition: transform 1.5s ease-in, opacity 1.5s ease-in, visibility 0s linear 0.5s; /* Transition properties */
 /* direction: normal;*/
  height: auto;
  width: 50%;
  top: 31px;
  left: 0%; 
  /*background-color: #005496;*/
  position: relative;
}

.slide-elementL.active {
  /* Active state: visible and positioned on-screen */
  /*transform: translateX(1.5%);*/
  opacity: 1;
  visibility: visible;
  /*transition: transform 1.5s ease-in, opacity 1.5s ease-in, visibility 0s linear 0.5s;*/ /* Transition properties for slide-in */
  /*animation-direction: normal;*/
  height: auto;
  /*width: 95%;*/
  top: 31px;
  /*left: .75%;*/
  /*background-color: #F7BE00;*//*#c00;*/
  position: relative;
}


.slide-element1 {
  /* Initial state: hidden and positioned off-screen */
  transform: translateX(0%); /* or translateY for vertical slide */
  opacity: 1;
  visibility: visible; /* Helps prevent interaction when hidden */
  transition: transform 1.5s ease-in, opacity 1.5s ease-in, visibility 0s linear 0.5s; /* Transition properties */
  animation-direction: normal;
/*	height: 200px;
  background-color: #005496;*/
  width: 47%;
  top: 34px;
  left:5%;
  position: relative;
  float: left;
}

.slide-element1.active {
  /* Initial state: hidden and positioned off-screen */
 /* transform: translateX(220%);*/ /* or translateY for vertical slide */
  opacity: 1;
  visibility: visible; /* Helps prevent interaction when hidden */
  /*transition: transform 1.5s ease-in, opacity 1.5s ease-in, visibility 0s linear 0.5s;*/ /* Transition properties */
 /*animation-direction: reverse;*/
 /*height: 200px;
  background-color: #c00;*/
  /*width: 95%;*/
  top: 30px;
  /*left:2.5%;*/
  position: relative;
}
/**/

.viconimgb {width: 26px!important; height: auto; margin-top: -1px; margin-left: -.4em; padding: .15em .5em .2em 0em; border-radius: 8px; transition: all .5s ease-in-out;}
.viconimgz {width: 62px!important; height: auto; margin-top: .5em;  margin-left: -2px; padding: .2em; margin-right: .5em; border: 2px #0060A1 solid; border-radius: .8em; transition: all .5s ease-in-out; cursor: pointer;}

.martop26 {margin-top: 2.55em!important;}

ul {width: auto; margin-bottom: -1.5em;}	
	
ul li {text-decoration: none; list-style-type: none; margin-left: 0em;}


textarea {color: #000; font-family: Calibri, Arial, Helvetica, sans-serif; font-size: 18px; line-height: 1.2em; width: 100%; padding: 2px 4px; background-color: #e7eff9; border-radius: 4px; resize: none;}
p.titl, li p.titl {font-size: 14px !important; font-weight: 600; color: #06C; margin-bottom: .2em;}
.ttlmkt {top: -10px!important; position: relative;}
.ruleD1 {position: relative; margin: 0em 0px 0px 0em; border-top: solid 2px #999999; height: 1em; width: 100%;}
.ruleD {position: relative; margin: 0em 0px 0px 0; border-top: solid 2px #999999; border-bottom: 0; height: 1em; width: 102.5%; }
.padall05 {padding: .5em;}
span.padbot4px {padding-bottom: 4px;}
.martop03 {position: relative; margin-top: 0.3em;}
.martop05 {position: relative; margin-top: 0.5em;}	
.martopless05 {position: relative; margin-top: -0.5em;}		
div.ruleRRS p a span {font-size: .8em!important; font-weight: 700; color: #fff;}
div.ruleRRS p a:hover span {font-size: .8em!important; font-weight: 700; color: #fff;}
div.ruleRRS p.bfwht {margin-bottom: 0em;}
div.ruleRRS p.bfwhtL {padding-top: .2em;}
/*div.ruleRRS p.bfwht {margin-top: -.5em!important;}*/
div.ruleRRSN p.bfwht {width: 300px;}
div.ruleRRSN {width: 300px;}
		
#medrec {padding-top: .75em!important;}

.opnclsrgt {position: absolute; width: 12%; right: 1.5%; font-size: 13px!important; height: 1.3em; padding-top: .2em; color: #fff; top: 5px; font-weight: 700; z-index: 1000;}
a .opnclsrgt {color: #fff!important;}
a:hover .opnclsrgt {color: #fff!important;}

ul.lstd li::marker {
font-size: 1.4em;
color: #005496 !important;
list-style-type: disc!important;
margin-top: -.5em;
}
.whtsp {white-space: nowrap;}

@media only screen and (min-width: 2105px) and (max-width: 3009px){	

.fntsz24rtop {
    font-size: 2.2em;
    color: #c00;
    font-weight: 400;
    font-family: "Oswald", "Roboto Condensed", "Helvetica Condensed", "Arial Narrow";
	margin-top: calc(.27 * 100vw)!important;
    margin-bottom: 0.8em;
    position: relative;
}

.fntsz24r {
    font-size: 2.2em;
    color: #c00;
    font-weight: 400;
    font-family: "Oswald", "Roboto Condensed", "Helvetica Condensed", "Arial Narrow";
	margin-top: calc(.02 * 100vw)!important;
    margin-bottom: 0.8em;
    position: relative;
}

.fntsz24rbfless {
    font-size: 1.9em;
    color: #c00;
    font-weight: 400;
    font-family: "Oswald", "Roboto Condensed", "Helvetica Condensed", "Arial Narrow";
    margin-top: -0.75em;
    margin-bottom: 0.4em;
}
.slide-elementL {width: 47%;}
.slide-element1 {width: 47%;}
.fltrghtpepr {float: right; margin-top: -1em; margin-right: -1em; border-radius: 8px;}		
.fltrghttruf {float: right; margin-top: -.15em; margin-right: -1em; border-radius: 8px;}	
	}
 
 
		

@media only screen and (min-width: 1200px) and (max-width: 2104px){	
	.slide-elementL {width: 47%;}
	.slide-element1 {width: 47%;}
	.fltrghtpepr {float: right; margin-top: -1em; margin-right: -1em; border-radius: 8px;}	
	.fltrghttruf {float: right; margin-top: -.15em; margin-right: -1em; border-radius: 8px;}		
	
}

@media only screen and (min-width: 960px) and (max-width: 1199px){
	.slide-elementL {width: 47%;}
	.slide-element1 {width: 47%;}
	.fltrghtpepr {float: right; margin-top: -1em; margin-right: -1em; border-radius: 8px;}
	.fltrghttruf {float: right; margin-top: -.15em; margin-right: -1em; border-radius: 8px;}	
}

@media only screen and (min-width: 768px) and (max-width: 959px){
	.slide-elementL {width: 50%;}
	.slide-element1 {width: 48%;}
	.fltrghtpepr {float: right; margin-top: -1em; margin-right: -.75em; border-radius: 8px;}
	.fltrghttruf {float: right; margin-top: -.15em; margin-right: -1em; border-radius: 8px;}	
	.fntsz15 {font-size: 1.3em;}
	.imgDogCatHome {float: right; width: 275px; height: auto; padding-top: 40px; margin: -3em 0em -.5em 1em;} 
	
}


@media only screen and (min-width: 640px) and (max-width: 767px){
/*		
div#oneA{top: 6px; left: 2%; position: absolute; white-space: nowrap!important; clear: left!important; display: none;} 
#opncls1{white-space:nowrap; position: relative; margin-top:-10px; margin-left: 160px;}		
div#twoA{top: 6px; left: -2%; position: absolute; white-space: nowrap!important; clear: left!important; display: none;}			
section#one {clear:left; width: 50%;}
section#two {clear:left; width: 48%;}	
.slide-elementL {clear: left; width: 94%; top: 10px;}
.slide-element1 {clear: left; width: 94%; top: 30px; left: 2%;}	
.martop26 {margin-top: .6em!important;}		*/
	
div#oneA{top: 6px; left: 6%; position: absolute; white-space: nowrap!important; float: left!important; display: block;} 
#opncls1{white-space:nowrap; position: relative; margin-left: 20px;}		
div#twoA{top: 6px; left: 54%; position: absolute; white-space: nowrap!important; float: left!important; display: block;}			
section#one {float:left; width: 95%; margin-top: 1em;}
section#two {float:left; width: 99%;}	 
.slide-elementL {float: left; top: 10px;}
.slide-element1 {float: left; top: 30px; left: 2%;}	
.martop26 {margin-top: 0.47em!important;}	
.fltrghtpepr {float: right; margin-top: -1em; margin-right: -.75em; border-radius: 8px;}	
.fltrghttruf {float: right; margin-top: -2.56em; margin-right: -1em; border-radius: 8px;}	
.fntsz15 {font-size: 1.3em;}
.twoAFB {left: 4.5%; margin-bottom: 2.3em;}	
#one.ruleRSS {margin: .5em 0px 0px -10px!important;}
.ruleRRS p.bfwht {font-size: 16px; width: 100%;}
.sumListR1 {font-size: 16px!important;}
.sumListR2 {font-size: 16px!important;}
.sumListRRS1 {font-size: 16px!important;}
.sumListRRS2 {font-size: 16px!important;}
section#two h3.bodtxtlg {font-size: .8em!important;}

.imgDogCatHome {float: right; width: 220px; height: auto; padding-top: 40px; margin: -3em 0em -.5em 1em;} 

h3.bodtxtlg {font-family: Arial, Helvetica, sans-serif, Roboto; font-size: 1em; font-weight: 500!important; line-height: 1.4em; width: 95%;}	
	
}

@media only screen and (min-width: 421px) and (max-width: 639px){

div#oneA{top: 6px; left: 2%; position: relative; white-space: nowrap!important; clear: left!important; display: none;} 
#opncls1{white-space:nowrap; position: relative; margin-top:-10px; margin-left: 160px;}		
div#twoA{top: 6px; left: -2%; position: relative; white-space: nowrap!important; clear: left!important; display: none;}	
section#one {clear:left; width: 100%;}
section#two {clear:left; width: 100%;}

.slide-elementL {clear: left; width: 94%; top: 10px;}
.slide-element1 {clear: left; width: 94%; top: 30px; left: 2%;}	
.martop26 {margin-top: .6em!important;}	
.fltrghtpepr {float: right; margin-top: -1em; margin-right: -.75em; border-radius: 8px;}	
.fltrghttruf {float: right; margin-top: -.15em; margin-right: -1em; border-radius: 8px;}	
.imgDogCatHome {float: right; width: 180px; height: auto; margin: -3em -3em -.5em .5em; margin-top: -10px!important; } 
p {color: #000; font-family: Calibri, Arial, Helvetica, sans-serif; font-size: .9em; line-height: 1.4em; max-width: 100%; margin-bottom: .5em;} 
h3.bodtxtlg {font-family: Calibri, Arial, Helvetica, sans-serif; font-size: .9em; font-weight: 500!important; line-height: 1.4em; width: 95%;}	
}

@media only screen and (min-width: 360px) and (max-width: 420px){

div.carebord {width: 100%; padding: .5em; padding-right: .5em; padding-bottom: 1.75em; border: #005496 solid 2px; display: flow-root;}

div#oneA{top: 6px; left: 2%; position: relative; white-space: nowrap!important; clear: left!important; display: none;} 
#opncls1{white-space:nowrap; position: relative; margin-top:-10px; margin-left: 160px;}		
section#one {clear:left; width: 100%;}
div#twoA{top: 6px; left: -2%; position: relative; white-space: nowrap!important; clear: left!important; display: none;}	
section#two {clear:left; width: 100%;}

.slide-elementL {clear: left; width: 94%; top: 10px;}
.slide-element1 {clear: left; width: 94%; top: 30px; left: 2%;}	
.martop26 {margin-top: .6em!important;}		

.martopflex {margin-top: .5em!important; padding-bottom: 2em;}
div.ruleRRS {width: 97%; font-family: 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow'!important;}
div.ruleRRS:hover {width: 97%; font-family: 'Roboto Condensed', 'Helvetica Condensed', 'Arial Narrow'!important;}
.petpos {margin-top: -1.5em;}
a.prflclr {background-color: #a00;}	
.martopflex {margin-top: -.5em; padding-bottom: 2em;}
.fltrght{float: right; margin-top: 0em;}
p.sumListR1{font-size: 14px!important; width: 43%;} 
p.sumListRRS1 {font-size: 14px!important; width: 43%;} 
p.sumListR2 {font-size: 14px!important; width: 43%;} 
p.sumListRRS2 {font-size: 14px!important; width: 43%;}	
	
p {color: #000; font-family: Calibri, Arial, Helvetica, sans-serif; font-size: .9em; line-height: 1.4em; max-width: 100%; margin-bottom: .5em;} 	
h3.bodtxtlg {font-family: Calibri, Arial, Helvetica, sans-serif; font-size: .9em; font-weight: 500!important; line-height: 1.4em; width: 95%;	}
.imgDogCatHome {float: right; width: 180px; height: auto; padding-top: 50px; margin: -3em -3em -.5em .5em;} 
	
}


	
	@keyframes myfirst {
  	0% {left: -600px;}
 	/* 25%  {left: 0px; }*/
  	/*75%  {left: 5%;} */
  	100% {left: 6%;} 
}