a {
    text-decoration: none;
    display: inline-block;
    padding: 8px 16px;
}

a:hover {
    background-color: #F0240B;
    color: yellow;
}

.previous {
    background-color: #900C3F;
    color: white;
}

.home {
    background-color: #900C3F;
    color: white;
}

.next {
    background-color: #900C3F;
    color: white;
}

.round {
    border-radius: 50%;
}

#head
{
	min-height:30px;
	background-color:white;
	border-bottom:2px solid #fff;
	padding:20px;
	clear:both
}
#footer
{
	min-height:10px;
	background-color:#B40404;
	border-top:2px solid #fff;
	padding:20px;
	clear:both;
	text-align:center
}
#nav{
	border-bottom:2px solid #fff;
}
#main
{
	padding:10px 10px 10px 10px;
	overflow: auto;
}


#article,#sidebar,#poll{background-color:white; min-height:250px;margin-bottom:20px;overflow:auto;overflow: auto;}
.content{padding:20px;overflow: auto;}
.clearfix{
	clear:both;
}

@media only screen and (min-width: 480px)
{
	
#header
{
background-color:#cc0000;	
}

	
}

@media only screen and (min-width: 768px){
#header
{
background-color:white;	
}
#article
{
float:left;
width:68%;
overflow: auto;
}

#poll
{
float:left;
width:68%;
overflow: auto;
}

#sidebar
{
float:right;
width:30%;
overflow: auto;
}


#logo
{
float:left;
width:10%;
}
#nav
{
width:100%;
}


}


* {
  box-sizing: border-box;
}

/* Create two equal columns that floats next to each other */
.column {
  float: left;
  width: 50%;
  padding: 10px;
  
}


/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}
/* Style the buttons */
.btn {
  border: none;
  outline: none;
  padding: 12px 16px;
  background-color: #f1f1f1;
  cursor: pointer;
}

.btn:hover {
  background-color: #ddd;
}

.btn.active {
  background-color: #666;
  color: white;
}

/* The container */
.container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 16px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  
}

/* Hide the browser's default radio button */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 30px;
  width: 30px;
  background-color: #0B94F0;
  animation: blinker 1.5s cubic-bezier(.5, 0, 1, 1) infinite alternate; 
  border-radius: 50%;
}

.footerbtn {
 
            display: block;
            line-height: 15px;
            position: fixed;
            left:0px;
            bottom:0px;
            height:40px;
            
border-radius: 15px;
  box-sizing: border-box;
  padding: 5px;
  background:#34af23;
  color: #ffffff;
  font-size: 18px;
  text-align: center;
  text-decoration: none;
  width:95%;
 margin-left:10px;
            margin-right:30px;
            box-shadow: 0 4px 12px 0 rgba(0, 0, 0, .3);
            animation: footer infinite linear 1s;
            -webkit-transform: translate3d(30%,0,0);
            transform: translate3d(30%,0,0);
            position: fixed;
           
}

.footerbtn :active {
            box-shadow: none
        }

        @-webkit-keyframes footer {
            from {
                -webkit-transform: rotateZ(0)
            }
            25% {
                -webkit-transform: rotateZ(1.5deg)
            }
            50% {
                -webkit-transform: rotateZ(0deg)
            }
            75% {
                -webkit-transform: rotateZ(-1.5deg)
            }
            to {
                -webkit-transform: rotateZ(0)
            }}

@-webkit-keyframes jello {  from, 11.1%, to {    transform: none;  }
  22.2% {    transform: skewX(-12.5deg) skewY(-12.5deg);  }
  33.3% {    transform: skewX(6.25deg) skewY(6.25deg);  }
  44.4% {    transform: skewX(-3.125deg) skewY(-3.125deg);  }
  55.5% {    transform: skewX(1.5625deg) skewY(1.5625deg);  }
  66.6% {    transform: skewX(-0.78125deg) skewY(-0.78125deg);  }
  77.7% {    transform: skewX(0.390625deg) skewY(0.390625deg);  }
  88.8% {    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);  }}
.jello {  -webkit-animation: jello 3s infinite;  transform-origin: center; -webkit-animation-delay:6s}
@-webkit-keyframes hue {
  from {    -webkit-filter: hue-rotate(0deg);  }
  to {    -webkit-filter: hue-rotate(-360deg);  }}
    .m1{position:fixed;left:1%; width:auto;height:100%;top:1%;color:#000;}
    .m2{position:fixed;right:1%; width:auto;height:100%;top:1%;color:#000;}
	



@keyframes blinker {
  from { opacity: 1; }
  to { opacity: 0; }
  
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #F91313;
  
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}


body h1, 
h2, 
h3, 
h4, 
h5, 
h6{
	    font-family: "Lato", sans-serif;
    font-weight: 700;
}

article,
aside,
footer,
header,
nav,
section {
	display: block;
}

h1 {
	font-size: 1em;
	margin: 0.67em 0;
}

h2 {
	font-size: 0.85em;
	margin: 0.57em 0;
}