/** 100 Mile Motel and RV Park                 **/
/** Designed By RORAPH GRAPHICS ®              **/
/** Code Hand Written By Wayne Roraph          **/
/** 100MileMotelandRVPark.Com - Copyright©2017 **/
/** Updated - November-15-2017                 **/

body {
    background-color:#374F35;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-family : verdana, arial, helvetica, sans-serif;
	font-size : 10px;
	font-weight : normal;
	scrollbar-3dlight-color : #ffffff;
	scrollbar-highlight-color : #374F35;
	scrollbar-darkshadow-color : #374F35;
	scrollbar-shadow-color : #ffffff;
	scrollbar-face-color : #ffffff;
	scrollbar-arrow-color : #374F35;
	scrollbar-track-color : #374F35;
} 
h1 {text-indent: -100em; margin:0px,0px,0px,0px;}
.l00mm a:link { color: #374F35; font-size: 16px; text-decoration: none;}
.l00mm a:visited { color: #374F35; font-size: 16px; text-decoration: none}
.l00mm a:hover { color: #ffffff; font-size: 16px; text-decoration: none}
.l00mm a:active { color: #ff0000; font-size: 16px; text-decoration: none;}
.100mm2 a:link { color: #ffffff; text-decoration: none;}
.l00mm2 a:visited { color: #ffffff; text-decoration: none}
.l00mm2 a:hover { color: #ffffff; text-decoration: none}
.l00mm2 a:active { color: #ff0000; text-decoration: none;}
.l00mm3 a:link { color: #ffffff; font-size: 10px; text-decoration: none;}
.l00mm3 a:visited { color: #ffffff; font-size: 10px; text-decoration: none}
.l00mm3 a:hover { color: #c0c0c0; font-size: 10px; text-decoration: none}
.l00mm3 a:active { color: #ff0000; font-size: 10px; text-decoration: none;}

.font-16{
	font-family: 'arial';
	font-size: 16px;
	color: #000000;
	font-weight: normal;
    /*** text-shadow: 0 0 1px #000000; ***/
}

.font-18{
	font-family: 'arial';
	font-size: 18px;
	color: #000000;
	font-weight: bold;
    /*** text-shadow: 0 0 1px #000000; ***/
}

.font-20{
	font-family: 'arial';
	font-size: 20px;
	color: #000000;
	font-weight: bold;
    /*** text-shadow: 0 0 1px #000000; ***/
}

top-20 {
    margin-top: 20px;
}

top-50 {
    margin-top: 50px;
}

top-100 {
    margin-top: 100px;
}

div.booking {
    padding-top: 5px;
    padding-left: 4px;
    padding-right: 4px;
}

.cc {
    padding-left: 4px;
    padding-right: 4px;
}

input:valid {
  color: #000000;
}
input:invalid {
  color: #b30000;
  font-weight: bold;
}

.left{
  float:left;
}

.clear{
  clear:both;
}

/*** hr colors ***/

/*** black thick ***/
hr.line1 {
        display: block;
        height: 2px;
        border: 0;
        border-top: 8px solid #000000;
        margin: 1em 0;
        padding: 0;
        width: 90%;
        margin-left:auto; 
        margin-right:auto;
}
/*** black thin ***/
hr.line2 {
        display: block;
        height: 2px;
        border: 0;
        border-top: 2px solid #000000;
        margin: 1em 0;
        padding: 0;
        width: 90%;
        margin-left:auto; 
        margin-right:auto;
}
/*** white thin ***/
hr.line3 {
        display: block;
        height: 2px;
        border: 0;
        border-top: 2px solid #ffffff;
        margin: 1em 0;
        padding: 0;
        width: 90%;
        margin-left:auto; 
        margin-right:auto;
}
/*** green thin ***/
hr.line4 {
        display: block;
        height: 2px;
        border: 0;
        border-top: 2px solid #374f35;
        margin: 1em 0;
        padding: 0;
        width: 100%;
        margin-left:auto; 
        margin-right:auto;
}

.center {
        text-align: center;   
}

.align-center {
        margin-left:auto; 
        margin-right:auto;
}

.align-right {
        text-align: right;
}
@media (max-width: 650px){
.align-right {
        text-align: right;
}
}
@media (max-width: 350px){
.align-right {
        text-align: right;
}
}

.align-left {
        text-align: left;
}
@media (max-width: 650px){
.align-left {
        text-align: left;
}
}
@media (max-width: 350px){
.align-left {
        text-align: left;
}
}

.table1 {
    background-color:#374F35;
    background-image:url('../images/bg-1x1080.jpg');
    background-repeat:repeat-x;
    background-attachment:fixed;
    background-position:center;
}

.table10 {
background: rgba(255,255,255,0.1);
    -webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}
.table20 {
background: rgba(255,255,255,0.2);
    -webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}
.table30 {
background: rgba(255,255,255,0.3);
    -webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}
.table40 {
background: rgba(255,255,255,0.4);
    -webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}
.table50 {
background: rgba(255,255,255,0.5);
    -webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}
.table60 {
background: rgba(255,255,255,0.6);
    -webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}
.table70 {
background: rgba(255,255,255,0.7);
    -webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}
.table80 {
background: rgba(255,255,255,0.8);
    -webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}
.table90 {
background: rgba(255,255,255,0.9);
    -webkit-animation: fadein 5s; /* Safari and Chrome */
       -moz-animation: fadein 5s; /* Firefox */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera */
            animation: fadein 5s;
}

#slideshow { 
    margin: 50px auto; 
    position: relative; 
    width: 600px; 
    height: 350px; 
    padding: 10px; 
    box-shadow: 0 0 20px rgba(0,0,0,0.4); 
}

#slideshow > div { 
    position: absolute; 
    top: 10px; 
    left: 10px; 
    right: 10px; 
    bottom: 10px; 
}

.NewsTable
{
background-color:White;
border: 2px solid black;
}
#transparent {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;
}

/** form **/

.form-font{
	font-family: 'arial';
	font-size: 12px;
	color: #000000;
	font-weight: normal;
    /*** text-shadow: 0 0 1px #000000; ***/
}

.form-font-2{
	font-family: 'arial';
	font-size: 14px;
	color: #000000;
	font-weight: bold;
    /*** text-shadow: 0 0 1px #000000; ***/
}

/*** start form code ***/
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab);
* {
/* With these codes padding and border does not increase it's width and gives intuitive style.*/

-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.font16 { font-family: 'Georgia Bold';
          font-size: 16px;
          color: #000000;
          font-weight: normal;
          text-align: left}
.ast    { font-family: 'Georgia Bold';
          font-size: 24px;
          color: #ff0000;
          text-shadow: 0 0 1px #000000;
          font-weight: bold;
          text-align: center}
div#envelope{
width: 55%;
margin: 10px 30% 10px 25%;
padding:10px 0;
/* border: 2px solid gray; */
border-radius:10px;
}
form{
width:50%;
margin:0% 0% 0% 0%;
}

/** start date picker **/
[type="date"] {
  background:#fff url(https://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/calendar_2.png)  97% 50% no-repeat ;
}
[type="date"]::-webkit-inner-spin-button {
  display: none;
}
[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0;
}

/* custom styles */
.check {
  padding: 4em;
  background: #e5e5e5;
  font: 13px/1.4 Geneva, 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
}
label {
  font-family: 'arial';
  font-size: 12px;
  color: #000000;
  font-weight: normal;
  display: block;
}
input[type="date"] {
  border: 1px solid #000000;
  border-radius: 5px;
  background-color: #fff;
  padding: 3px 5px;
  box-shadow: inset 0 3px 6px rgba(0,0,0,0.1);
  width: 120px;
}
/** end date picker **/

/* Makes responsive fields. Sets size and field alignment.*/
input[type="text"]{
margin-bottom: 1px;
margin-top: 0px;
border:1px solid #000000;
border-radius:5px;
padding: 3px 5px;
box-shadow: inset 0 3px 6px rgba(0,0,0,0.1);
width:100%;
}

textarea{
margin-bottom: 1px;
margin-top: 0px;
border:1px solid #000000;
border-radius:5px;
padding: 3px 5px;
box-shadow: inset 0 3px 6px rgba(0,0,0,0.1);
width:100%;
resize:none;
}
input[type="text"]:focus,textarea:focus {
border-style: solid;
border-width: 1px;
border-color: #919191;
background-color: #efefef;
}
@media all and (max-width: 650px) {
div#envelope{
width: 90%;
margin: 10px 5% 10px 5%;
padding:10px;
/* border: 2px solid gray; */
border-radius:10px;
}
form{
width:100%;
margin:0;}
} 
@media all and (max-width: 350px) {
div#envelope{
width: 96%;
margin: 5px 2% 5px 2%;
padding:10px 0;
/* border: 2px solid gray; */
border-radius:10px;
}
form{
width:100%;
margin:0;}
}
/** end form code ***/

.submit
{
    width:80px;
    height: 30px;
    line-height: 15px;
    padding-bottom: 0px;
    vertical-align: middle;
    font-family: 'Georgia Bold';
    font-size: 16px;
    font-weight: bold;
    text-transform: none;
    border:1px solid transparent;
    background: #ffffff;
    color: #000000;
   -moz-border-radius: 5px;
    border-radius: 5px;
    border-color: #000000;
    border-style: solid;
    border-width: 3px;
    cursor: pointer;
}
.submit:hover
{
    background-color:#efefef;
    font-weight: bold;
    color: #919191;
}