@media only screen
    and (min-device-width: 0px)
    and (max-device-width: 324px)
    and (-webkit-min-device-pixel-ratio: 1) {
      body{
        background-color: Pink;
      }
    }


  @media only screen
    and (min-device-width: 324px)
    and (max-device-width: 768px)
    and (-webkit-min-device-pixel-ratio: 1) {
      body{
        background-color: lightBlue;
      }
    }

  @media only screen
    and (min-device-width: 768px)
    and (max-device-width: 1024px)
    and (-webkit-min-device-pixel-ratio: 1) {
      body{
        background-color: Blue;
      }
    }


/*Start of Stylesheet for overall look of page*/
html {
      padding: 0px 40px;
      max-width:1000px;
      margin-left: 10%;
      }

/*<--Start of body styling, margin edit, width and border specifications -->*/
body {
      margin: 30px;
      width: inherit;
      border: black solid 2px 2px;
      }
/*<--End of Body -->*/

/*<-- Font styling -->*/
h1,h2,h3,h4,h5,h6 {
                  font-family: 'Playfair Display', serif;
                  }

p {
  font-family: 'Dosis', sans-serif;
}
/*<-- End font styling-->*/

/*<-- Start Cursor display changes when over link-->*/
a {
  cursor: pointer;
}
/*<--End of cursor edit -->*/


/*<-- Start Navbar horizontal inline display with padding and background styling-->*/
div.navbar {
            width: inherit;
            height: 80px;
            background-image: linear-gradient(#6CF,black);
            border-top: grey solid 2px;
            border-left: grey solid 2px;
            border-right: grey solid 2px;
            contain:content;
            padding-bottom: 20px;
            }

ul.navlist {
            margin-top: 16px;
            padding-top: 14px;
            width: 80%;
            float: left;
            }

img.NavLogoTop {
                margin-left: 2%;
                margin-top: 2%;
                }

li.navli {
          display: inline;
          width:inherit;
          color:#FFF;
          font-size: 24px;
          margin: 0 1%;
          font-weight: bold;
          letter-spacing:1.5px;
          padding:16px 5%;
        }

li.navli a {
			color: white:
}
/*<--Nav style End-->*/

/* list anchor no decoration*/
li a {
      text-decoration: none;
      }

/* mouse over link */
li a:hover:not(.active) {
                         background-color: #111;
                        }

/* mouse over link */
li a:hover {
            color: red;
            }

.active {
         background-color: #609cf2;
        }

/*<--Start of content styling, editing padding -->*/
div.Content {
            padding-left:10px;
            padding-right:10px;
            }
/*<--End of content -->*/

/*<--Start of aside styling, float editing, border and margin edits -->*/
aside {
      float:right;
      border: #000 solid 1px;
      margin: 20px;
      }

li.SocialMenu {
				list-style-type:none;
				display:inline;
				margin-left: 10%;
}
/*<--End of aside -->*/


div.Headlines {
              float:left;
              padding-left:5px;
              padding-right: 5px;
              max-width: 58%;
              height: inherit;
              margin-top:0px;
              }

div.Content	{
	        padding-top:0px;
			}

aside {
		float:right;
		width: 35%;
		border: 0px;
		margin-right:20px;
		}


#PhotoCap {
  background-color:#39C;
  margin-top: 0px;
  padding-top: 18px;
  padding-left: 4px;
  float:left;
  height:46px;
  width: 99%;
              }

img {
      float: left;
    }

section.main {
          border:#CCC solid 1px;
          width: 98%;
          height: 252px;
          margin-bottom: 15px;
		  margin-left: 5px;
          }

div.Text {
          width: 42%;
          float: right;
		  padding-right:10px;
          }

div.caption {
            height: inherit;
            width: 52%;
            float: left;
            contain: content;
            }

div.others {
            contain: content;
            padding-left: 5px;
            padding-right: 5px;
}

div.others h3 {
              padding-left: 32%;
              margin-top: 0px;
              border-top:  lightgrey ridge 16px;
              padding-top:10px;
}

div.others p {
              padding-left:0px;
              margin-bottom: 0px;
              text-indent: 32%;
}

#date {
	  text-indent:0px;
	  padding-left: 32%;
	  font-size:13px;
	  color:#666;
		}

div.tags {
          float: left;
          margin: 0px;
          padding: 0px;
          font-size: 13px;
          contain: Content;
          width:100%;
}

#tags {
	  text-indent:0px;
}

div.tags p {
            color: red;
            text-decoration: underline;
            margin-left: 0;
            margin-bottom: 0;
            float: left;
            width: 8%;
}

div.tags li {
            display: inline;
            list-style-type: none;
            margin: 5px;
            text-decoration:underline;
}

div.tags li a:hover {
                    background-color: transparent;
                  }

div.SideSocial {
				background-color:#39C;
				padding-top: 3px;
				color:white;
				}

div.follow {
		padding-top:10px;
		contain: content;
		border-top:solid #CCC 1px 1px;
}

table {
		width: 100%;
		border-top:#CCC solid 1px;
		border-bottom: #CCC dashed 1px;
		border-left: #CCC solid 1px;
		border-right: #CCC solid 1px;
		background:#FFF;
}

td img{
	float:none;
	padding-left: 22px;
}

#message {
			background:#FFF;
			margin-bottom:0px;
			color: Black;
}

form {
	 padding-left:10px;
	 padding-top:10px;
	 border-bottom:#CCC solid 1px;
	 border-left:#CCC solid 1px;
	 border-right:#CCC solid 1px;
	 padding-bottom:6px;
}

/*<--Start of Footer, inline styling including padding, position and background colour -->*/
footer {
        clear:both;
        background-image: linear-gradient(black,#6CF);
        height: 80px;
        padding-top: 30px;
        padding-left: 30px;
        padding-right: 30px;
        border-bottom: grey solid 2px;
        border-left: grey solid 2px;
        border-right: grey solid 2px;
        contain: content;
        }

div.social {
            float:left;
            }

div.Extra {
          margin-left: 320px;
          margin-right: 120px;
        }

table.footSocial {
				background-color:transparent;
				border: 0px;
				margin-left:40px;
				width:112px;
}

table.FootUl {
			display:table;
			padding-left: 0px;
			border: 0px;
			margin:0px;
			background-color:transparent;
			}

td.FootUl a {
			letter-spacing:0.5px;
			padding-right:16px
			}

td.footSocial img {
				padding:0px;
}

div.end {
		float:right ;
		contain: content;
}

#Copywrite {
			margin-top:0px;
			margin-bottom:0px;
			font-size:10px;
}

/*<-- Footer End -->*/