/* css for sending form */

/* not used but may need */
 .opcont-white {
   background: rgb(255, 255, 255); /* Fallback */
       background: rgba(255, 255, 255, 10px 0.7);
       }
  
.error{

        outline: 1px solid red;

    }         

#anh1{float: right;margin-right: 50px;}
.marg-in {float: left; margin: 55px 0 0 15px;}

#showdsk{display:block;;}
#showmob{display:none;;}
@media only screen and (max-width: 768px) {
.col-1c {width:100%;   text-align:left; margin-left:0px; margin-top: 2px;}
.col-athird{width:100%; text-align:left; margin-left:0px; margin-top: 2px}
.col-3q{width:100%; margin:auto; padding:15px;}
.col-2quater{width: 100%;}
.col-v-long {width:100%; margin-left:0px !important; }
.col-2half {position:relative !important; padding:10px; margin-top:5px !important; width: 100% !important; margin: auto !important; color:blue !important;}
.col-last {width:100%; margin:0px !important;}#bkyellow {width:95% !important; display: block;  margin:0px !important; padding:10px !important;}
.mycontainer {width:100% !important;  margin:0px !important; position:absolute; left:0px; right:0px; display:block;}
#bkyellow {width:100% !important;  margin-left:auto !important;  margin-right:auto !important; margin-top:5px !important;padding:10px !important; }
.col-2r {position:relative !important; width: 100% !important; margin: auto !important; padding:5px; margin-bottom:10px !important;}
/* margins for a third when in mobile view */
#showdsk{display:none;}
#showmob{display:block;}
#anh1{float: none; margin-right: 0;}
}
	
/* div for hiding php processing a form */
.hidephp {
position: absolute;
top:1px;
left:1px;
height:1px;
}


.pad-ing{padding:10px 0px 10px 12px;}
/* class marg-in is for the margin in the phone and email box */
@media only screen and (max-width: 780px){
.marg-in {
	margin:0px;
	float: none;
}}

.col-1 {width:100%;}
.col-2rl {width:45%; display:inline-block; padding:10px;}
.col-2r {width:45%; display:inline-block; padding:10px;}
 
.col-last {width:100%; margin-top:100px;}
/* dontshowme is for the social media div in the mobile view */
#dontshowme{display:none;}
@media only screen and (max-width: 768px) {

.col-2r {position:relative !important; width: 100% !important; margin: auto !important; padding:5px; margin-bottom:10px !important;}
/* margins for a third when in mobile view */

}



/* the box that holds the phone details and email */
.ourdetails {
	border-style: solid;
	border-color: green; 
	border-radius: 10px;
	padding: 10px;
	
	/* background: url(backg3.jpg) no-repeat center center; */
		
	
}
/* change background size for mobile */
@media only screen and (max-width: 768px){
.ourdetails {
	border-style: solid;
	border-color: green; 
	border-radius: 10px;
	padding: 10px;
	 /* background: url(backg4.jpg) no-repeat center center; */
		
}}


/* details box - desktop  styles*/
.detstyles10 {
	width:10%;
padding: 5px 5px 10px 20px;
	font-size:20px;
	font-weight: bold; 
	margin-top: 5px;
		}
	.detstyles90 {
	width:90%;
font-size:20px;
	font-weight: bold;
	padding:10px 5px 10px 20px; 
	
			}
			
		h1.mobfnt {font-size:220%; color:white; line-height:50%; }
		h2.mobfnt {font-size:220%; color:red; line-height:100%; text-align:center; }
		h3.mobfnt {font-size:180%; line-height:50%; padding-bottom: 10px;}
		.emailfnt {font-size:20px; padding: 10px 5px 10px 20px;}
		/* end fonts and sizes for Desk Top */
@media only screen and (max-width: 768px){
h1.mobfnt  {font-size:20px; color: white; line-height:120%;}
h2.mobfnt {font-size:25px; color:red; line-height:120%; font-weight:bold;text-align:center; }
h3.mobfnt {font-size: 16px; padding:0px; line-height:130%; color:black}



.detstyles10 {
	width:10%;
	padding: 5px;
	font-size:20px;
	font-weight: bold; 
	}
	.detstyles90 {
	width:90%;
	font-size:20px;
	font-weight: bold;
	padding:5 5 5 10px;
		}
		.emailfnt {font-size:12px; padding:10px 5px 10px 10px}
}

/* class for width of our services in deskto view */
.col-3.clasp {
	padding-top: 0px;
	width: 19%;
	height: auto;
	background-color:white;
	display: inline-block;
	margin: 0px 5px 5px 5px;
}


/* css for email contact form */

.fancyform {
    width: 80%;
    font-size: 15px;
   padding: 5px;
   margin: 8px 0;
   /* display: inline-block;*/
   
    border: 1px solid #ccc;
    border-radius: 4px;
    }

.fancyform:hover {
background-color: white;

}
.astrix {
    color: red;
    font-size: 18px;
    font-weight: bold;
    display: inline-block;
    
}
/* BUTTONS */

/* email box buttons for desk top */
.butns {
	width:100px;
	height:auto;
	border-radius:5px;
	box-shadow: 2px 2px 2px #888888;
	cursor:pointer;
	text-align:center;
	font-weight:bold;
	font-size:15px;
	background-color: lightgrey;
		 display: inline-block;
		
}

@media screen and (max-width:768px){
.butns {
	width:60px;
	height:auto;
	border-radius:2px;
	box-shadow: 2px 2px 2px #888888;
	text-align:center;
	background-color:lightgrey;
	font-family:arial narrow;
	font-size:10px;
 display: inline-block;

}
.astrix {display: none;}
}


.butns:hover {
background-color:linen;
}
.butns:active {
background-color:grey;
}
.butns p {
margin: 0px;
padding:5px;
}

/* class for spacing the buttons so that they align center */
.butnspace {
	margin-left:30px;
}

@media screen and (max-width:768px){
.butnspace {
	margin-left:8px;
}}
.lineup {
display: inline-block;
}
/*:invalid { background: blue; } if form is invalid - check hoe to identify id*/)



/* end sendstuff.css */