@font-face {
    font-family: 'belleroselight';
    src: url('font/bellerose-webfont.eot');
    src: url('font/bellerose-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/bellerose-webfont.woff2') format('woff2'),
         url('font/bellerose-webfont.woff') format('woff'),
         url('font/bellerose-webfont.ttf') format('truetype'),
         url('font/bellerose-webfont.svg#belleroselight') format('svg');
    font-weight: normal;
    font-style: normal;

}

body{ margin:0 0 1em 0; padding:0; background:#000 url(images/back.jpg) no-repeat center top; color:#fff; font-family: 'belleroselight'; text-align:center;}
a{ color:#fff}
.opperdiv{ width:100%; max-width:978px; margin:0 auto;}
.oppertxt{ width:41%; text-align:center; padding-top:60px; float:left; padding-left:5%;}
.opperimg{ width:45%; text-align:center; padding-top:60px; float:right; padding-right:5%;}
.opperimg img{ width:100%;}
.clear{ clear:both;}
h1,h2,h3{ font-weight:300; margin:0; padding:0;}
h1{ font-size:44px; line-height:42px;}
h2{ color:#d60b32; font-size:110px;}
h3{ font-size:36px; margin:1em 0 0.5em;}
.thumbs{ text-align:center; margin:0 auto; width:100%; max-width:978px;}
.thumbs a{display: inline-block; animation-play-state: paused; margin-right:6px; margin-bottom:6px;}
.thumbs a:nth-child(4n+4){ margin-right:0;}
@keyframes thumbhover {
    0% {transform:rotate(0deg);}
    25% {transform:rotate(1deg);}
    50% {transform:rotate(0deg);}
    75% {transform:rotate(-1deg);}
    100% {transform:rotate(0deg);}
}

.thumbs a:hover{animation:thumbhover 0.2s linear infinite; transform-origin: 50% 50%; animation-play-state: running;}

@media only screen and (max-width : 1023px) and (orientation:landscape) {
	.thumbs{ width:96%; margin:0 auto;}
	.thumbs a{ width:24%; margin-right:1%; margin-bottom:1%;}
	.thumbs img{ width:100%;}
	.thumbs a:nth-child(4n+4){ margin-right:0%;}
	.oppertxt{ padding-top:2em; padding-bottom:1em;}
	.opperimg{ padding-top:2em; padding-bottom:1em;}
	h1{ font-size:30px; line-height:30px;}
	h2{ font-size:55px;}
	h3{ font-size:24px;}
	.divider{ width:80%; margin:0 auto;}
}
@media only screen and (max-width : 1023px) and (orientation:portrait) {
	.thumbs{ width:96%; margin:0 auto;}
	.thumbs a{ width:49%; margin-right:2%;}
	.thumbs img{ width:100%;}
	.thumbs a:nth-child(4n+4){ margin-right:2%; margin-bottom:2%;}
	.thumbs a:nth-child(2n+2){ margin-right:0;}
	.oppertxt{ width:90%; margin-left:5%; text-align:center; padding-top:20px; float:none; padding-left:0%;}
	.opperimg{ width:100%; text-align:center; padding-top:1em; padding-bottom:1em; float:none; padding-right:0%;}
	.opperimg img{ width:60%;}
	h1{ font-size:22px; line-height:21px;}
	h2{ font-size:55px;}
	h3{ font-size:17px;}
	.divider{ width:80%; margin:0 auto;}
}

@keyframes animated {
    0%, 100% {color: #ffffff; letter-spacing:0px;}
    50% {color: #d60b32; letter-spacing:2px;}
}
.animated1{
	color:#ffffff;
	letter-spacing:0px;
    animation:animated 2s linear infinite;
}
.animated2{
	color:#ffffff;
	letter-spacing:0px;
    animation:animated 2s linear infinite;
	animation-delay: 1s;
}