﻿/* CSS - COPYRIGHT BRYANONEILL.COM */



html {background:#000000;}

/* BORDER CONTAINER ======================================= */
#container {
	width: 1024px;
	float: center;
	margin: 20px auto;
	background-image:url("images/old-paper-texture.jpg");
	padding: 0px 30px 30px 30px;
	overflow: hidden;
	border-radius: 5px;
	border: 1px solid;
}
/* NAVAGATION ==================================== */


nav {
	float: center;
	width: 1024px;
	margin: 40px 0px 0px 0px;
	padding: 0 auto 0;
	border:solid 0px;
	font-family:Arial, Helvetica, sans-serif;
    /*border-radius: 5px;
	box-shadow: 1px 1px 1px 1px #000;*/
	text-align: center;
	font-size: 20px; /* Font Size */
	text-shadow: 0px 0px 0px #fff;
}

row {
	float: left;
	width: 1024px;
	height: 60px;
	margin: 0 auto 15px;
	padding: 0 auto 0;
	-webkit-border-radius: 5px; /* Saf3-4, iOS 1-3.2, Android ≤1.6 */;
	-moz-border-radius: 5px; /* FF1-3.6 */;
	border-radius: 5px;
    -webkit-box-shadow: 0px 0px 0px 0px #ffffff; /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */;
	-moz-box-shadow: 0px 0px 0px 0px #ffffff; /* FF3.5 - 3.6 */;
	box-shadow: 0px 0px 0px 0px #ffffff;/* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
text-align: center;
	font-size: 20px;
	line-height: 15px;
	text-shadow: 1px 1px 3px #000; /* 1 1 3 #00 */
	text-color:#fff
}

a.nav {color:#000; /* Font Color */
text-shadow: 1px 1px 3px #000; /* 1px 1px 1px #000 */
font-size:12;
	text-decoration: none;
	transition: all .5s linear;
	-o-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-ms-transition: all .5s linear;
	text-shadow: 1px 1px 3px #000; /* 1px 1px 1px #000 */}
a.nav:active {color:red;} /* Fade Color */
a.nav:hover {color:red;
	text-decoration:none;
	transition: all .5s linear;
	-o-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-ms-transition: all .5s linear;
	text-shadow: 1px 1px 3px #000; /* 1px 1px 1px #000 */
}

/* SECTION CONTAINER ================================= */

box {
	float: center;
	width: 1024px;
	margin: 80px 0px 0px 0px;
	padding: 0 auto 0;
	border:solid 1px;
	position:relative;
    /*border-radius: 5px;
	box-shadow: 1px 1px 1px 1px #000;*/
	text-align: center;
	font-size: 24px; /* Font Size */
	text-shadow: 3px 3px 3px #fff; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}




/* TEXT STYLES =========================================== */

p.logo  {
	font-family:Garamond;
	color: #000;
	font-size:60px;
	padding: 20px 0px 0px 0px;
	margin:0px;
	text-shadow: 1px 1px 2px #000;}
a.logolink {color:black;text-decoration:none;}
a.logolink:active {color:black;text-decoration:none;}
a.logolink:hover {color:black;text-decoration:none;}

	
p.logo2  {
	font-family:Garamond;
	color: #000;
	font-size:25px;
	padding: 0px;
	margin: 0px;
	text-shadow: 1px 1px 2px #000;}

p.logo3  {
	font-family:Garamond;
	color: #000;
	font-size:20px;
	padding: 0px;
	margin: 0px;
	text-shadow: 1px 1px 2px #000;}

p.appearance {
	font-family:Garamond;
	font-size:25px;
	position:relative;
	text-shadow: 1px 1px 2px #000;}

p.normal {
	font-family:Garamond;
	color:black;
	font-size:20px;
	text-shadow: 0px 0px 0px #000;
	padding-top: 0px;
    padding-right: 50px;
    padding-bottom: 0px;
    padding-left: 0px;}

p.title {
	font-family:Garamond;
	color:black;
	font-size:25px;
	text-shadow: 1px 1px 2px #000;}

p.article
p.review
p.buynow
p.footer {
	font-family:Garamond;
	color: #000;
	font-size:20px;
	padding: 0px;
	margin: 0px;
	text-shadow: 1px 1px 2px #000;}

/* IMAGE PROPERTIES ============================================= */
 
 img { box-shadow: 5px 5px 5px #888888;
 margin-right:20px} 



/* SLIDE FADER ============================================== */

.crossfade-wrapper {
	width:1024px; /* Width of Slides Box */
    height:300px; /* Height of Slides Box */
    margin:2px 0px 0px 0px;
    overflow:hidden;
    border:solid 1px;
    position:relative;

}
#crossfade > img { 
width:1024px; /* Width of Slides Box */
    height:300px; /* Height of Slides Box */
    top: 0px;
    left: 0px;
    color: transparent;
    position:absolute;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 30s linear infinite 0s;
    -moz-animation: imageAnimation 30s linear infinite 0s;
    -o-animation: imageAnimation 30s linear infinite 0s;
    -ms-animation: imageAnimation 30s linear infinite 0s;
    animation: imageAnimation 30s linear infinite 0s; 
}
#crossfade > img:nth-child(2)  {
width:1024px; /* Width of Slides Box */
    height:300px; /* Height of Slides Box */
    top: 0px;
    left: 0px;
    color: transparent;
    position:absolute;
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s; 
}

#crossfade > img:nth-child(3) { 
    position:absolute;
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s; 
}
#crossfade > img:nth-child(4) { 
    position:absolute;
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s; 
}
#crossfade > img:nth-child(5) { 
    position:absolute;
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s; 
}

@-webkit-keyframes imageAnimation { 
    0% { opacity: 0;
    -webkit-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -webkit-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-moz-keyframes imageAnimation { 
    0% { opacity: 0;
    -moz-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -moz-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-o-keyframes imageAnimation { 
    0% { opacity: 0;
    -o-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -o-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-ms-keyframes imageAnimation { 
    0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -ms-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@keyframes imageAnimation { 
    0% { opacity: 0;
    animation-timing-function: ease-in; }
    8% { opacity: 1;
         animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}



/* FOOTER ============================================================== */










/* LINK PROPERTIES ========================================================== */
a {}
a:hover {}

a.baselink {color:blue;
font-size:18;
	text-decoration: none;
	transition: all .5s linear;
	-o-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-ms-transition: all .5s linear; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}
a.baselink:active {color:red;}
a.baselink:hover {color:gold;
font-size:18;
	text-decoration: none;
	transition: all .5s linear;
	-o-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-ms-transition: all .5s linear; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}
a.buylink {color:white;
font-size:24;
	text-decoration: none;
	transition: all .5s linear;
	-o-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-ms-transition: all .5s linear; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}
a.buylink:active {color:white;}
a.buylink:hover {color:gold;
font-size:18;
	text-decoration: none;
	transition: all .5s linear;
	-o-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-ms-transition: all .5s linear; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}

a.normal {color:blue;
font-size:14;
	text-decoration: none;
	transition: all .5s linear;
	-o-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-ms-transition: all .5s linear; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}
a.normal:active {}
a.normal:hover {color:red;font-size:14;
	text-decoration: underline;
	transition: all .5s linear;
	-o-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-webkit-transition: all .5s linear;
	-ms-transition: all .5s linear;/* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}

p.tablecenter, tr, td {color: #000000;-moz-box-shadow: 0px 0px 0px 0px #fff;
	-webkit-box-shadow: 0px 0px 0px 0px #fff;
	box-shadow: 0px 0px 0px 0px #fff;
	-webkit-border-radius: 0px; /* Saf3-4, iOS 1-3.2, Android ≤1.6 */;
	-moz-border-radius: 0px; /* FF1-3.6 */;
	border-radius: 0px;
}

/* ===================================== CELLPHONE TABLET MEDIA STYLES =========================== */


/* Smartphones (portrait and landscape) ----------- */

@media only screen
and (min-width : 320px)
and (max-width : 480px) {
/* Styles */
}
 
/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
/* Styles */
}
 
/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* Styles */
}
 
/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px) {
/* Styles */
}
 
/* iPads (landscape) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : landscape) {
/* Styles */
}
 
/* iPads (portrait) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : portrait) {
/* Styles */
}
 
/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
/* Styles */
}
 
/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
/* Styles */
}
 
/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}
