body{border:0px solid white; width:100%; margin:0px 0px; padding:0px 0px; color:#000000; font-size:28px; font-family:Roboto; font-weight:300; background:#ffffff;


//background-image:url('/bg.png') ;
//background-size:100%   ;
}



html,body{height:100%; margin:0;}
body{}
body::-webkit-scrollbar{width:0;}
body{-ms-overflow-style:none; scrollbar-width:none;}

.index {

background: url('thankyou.jpeg')0px 50% no-repeat fixed #ffffff;
background-size: 100% 100%; }



input{font-size:24px; text-align:center; margin:2px 0;}
*{box-sizing:border-box;}
.full-height{height:100%; background:none;}

.col-16{width:100%; border:0px solid white; padding:0px; margin:0px; font-weight:normal; font-style:normal; text-align:center; float:left; background:transparent;}




.col-16#album{width:100%; border:02px solid red; padding:1% 10%; margin:0px; font-weight:normal; font-style:normal; text-align:center; display:block;float:left;




}




.col-8{width:50%; border:0px solid white; padding:0px; margin:0px; font-weight:normal; font-style:normal; float:left; background:transparent;}

.col-8.r{text-align:right;}

.col-8.l{text-align:left;}

.glovebox{text-align:right; position:absolute; right:0;}




form.col-16.album_cover{border:0px solid red; width:50%; padding:20px 10% ; margin: 0px; }
form.col-16.album_cover span.col-16.title{border:0px solid yellow; font-size:24px; text-transform:Capitalize;}
form.col-16.album_cover cover{border:04px solid green;}



form.col-16.album_cover button{border:0px solid blue;  cursor:pointer;-webkit-border-radius: 25px 25px 25px 25px;
-moz-border-radius: 25px 25px 25px 25px;
-khtml-border-radius: 25px 25px 25px 25px;
border-radius: 25px 25px 25px 25px;
-webkit-box-shadow: 0px 6px 6px #DDDDDD;
-moz-box-shadow: 0px 6px 6px #DDDDDD;
box-shadow: 0px 6px 6px #DDDDDD;}




form.col-16.album_cover img{border:0px solid purple;}
form.col-16.album_cover span.col-16.description{border:0px solid black;}





div.col-4{width:25%; border:00px solid white; padding: 2px 20px ; margin: 0px 0px 02px 0px; display:block; float:left; background:transparent;}
 
div.col-4 img{
border:00px solid #545454; width:100%; padding:1px; margin:0px; display:block; float:left; cursor:pointer; background:transparent;}

div.col-4 img:hover{
border:00px solid transparent; width:100%; padding:1px; margin:0px; display:block; float:left; cursor:pointer; background:transparent;}






div.col-4 span.col-16.title{border:0px solid red; width:100%; padding:0px; margin:0px; font-size:20px; font-weight:normal; font-style:normal; text-align:center; text-transform:Capitalize; display:block; float:left; background:transparent;}




div.col-16.albumimgbig{width:100%; height:100%; padding: 0px; display:none;}
div.col-16.albumimgbig span.title{border:0px solid #000000; width:100%; padding:0px; margin:0px; font-size:28px; font-weight:normal; font-style:normal; text-align:center; text-transform:Capitalize; display:block; float:left; background:#ffffff;}


div.col-16.albumimgbig span.description{border:0px solid red; width:100%; padding:0px; margin:0px; font-size:22px; font-weight:normal; font-style:normal; text-align:center; display:block; float:left; background:#ffffff;}

.position_next{display:none;}
.position_back{display:none;}

div.col-16.toprow {position:fixed; top:0; left:0; background:transparent;}
div.col-16.bottomrow {position:fixed; bottom:0; left:0; background:transparent;}



div.col-16.bottomrow img{width:60px;-webkit-border-radius: 25px 25px 25px 25px;
-moz-border-radius: 25px 25px 25px 25px;
-khtml-border-radius: 25px 25px 25px 25px;
border-radius: 25px 25px 25px 25px;
-webkit-box-shadow: 0px 6px 6px #DDDDDD;
-moz-box-shadow: 0px 6px 6px #DDDDDD;
box-shadow: 0px 6px 6px #DDDDDD;}

  



span.col-16#badge img{width:60px;-webkit-border-radius: 25px 25px 25px 25px;
-moz-border-radius: 25px 25px 25px 25px;
-khtml-border-radius: 25px 25px 25px 25px;
border-radius: 25px 25px 25px 25px;
-webkit-box-shadow: 0px 6px 6px #DDDDDD;
-moz-box-shadow: 0px 6px 6px #DDDDDD;
box-shadow: 0px 6px 6px #DDDDDD;}

  



img.badge{width:120px; margin: -1px 0px 0px 0px ; vertical-align: middle; -webkit-border-radius: 25px 25px 25px 25px;
-moz-border-radius: 25px 25px 25px 25px;
-khtml-border-radius: 25px 25px 25px 25px;
border-radius: 25px 25px 25px 25px;
-webkit-box-shadow: 0px 6px 6px #DDDDDD;
-moz-box-shadow: 0px 6px 6px #DDDDDD;
box-shadow: 0px 6px 6px #DDDDDD;}







span.title{border:0px solid red; width:100%; padding:0px; margin:0px; font-size:24px; font-weight:normal; font-style:normal; text-align:center; text-transform:Capitalize; display:block; float:left; background:transparent;}



img.srcposition:hover{width:400px; height:325px;  border:0px solid blue;position:absolute; left:40%;}

img.srcposition{width:90px; height:50px; float:none; border:0px solid blue;}


.mySlides {display: none;}
img {vertical-align: middle;}

 
.slideshow-container {
  width: 100%;
   height: 100%;
  position: fixed;
  margin: auto;
}
  
 

 
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 6.5s;
  animation-name: fade;
  animation-duration: 6.5s;
}

@-webkit-keyframes fade {
  from {opacity: .0} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .0} 
  to {opacity: 1}
} 


.w3-animate-opacity2{animation:opac 10.8s 0}

@keyframes opac{from{opacity:1} to{opacity:0}

}

 


.transform{border: 0px; padding:0px 8px; margin: 4px 0px 8px 0px; color:#000000; font-size:28px; font-family:Roboto; font-weight:300; background:#ffffff; cursor:pointer;-webkit-border-radius: 25px 25px 25px 25px;
-moz-border-radius: 25px 25px 25px 25px;
-khtml-border-radius: 25px 25px 25px 25px;
border-radius: 25px 25px 25px 25px;
-webkit-box-shadow: 0px 6px 6px #DDDDDD;
-moz-box-shadow: 0px 6px 6px #DDDDDD;
box-shadow: 0px 6px 6px #DDDDDD;}






#Default {color:#ffffff;background-color:#000000;}
#BackinBlack {color:#ffffff;background-color:#000000;}
#WhiteAlbum {color:#000000;background-color:#ffffff;}
#RudolphRed {color:#ffffff;background-color:#ff0000;}
#RubyTuesday {color:#ffffff;background-color:ruby;}
#MellowYellow {color:#000000;background-color:#ffeb3b;}
#YellowSubmarine {color:#000000;background-color:#ffffcc;}
#GreenTambourine {color:#ffffff;background-color:#4CAF50;}
#GreenGrass {color:#000000;background-color:#8bc34a;}
#MoodyBlue {color:#ffffff;background-color:#2196F3;}
#PowderBlue {color:#000000;background-color:#87CEEB;}
#BlueBayou {color:#000000;background-color:#87CEEB;}
#Aqualung {color:#000000;background-color:#00ffff;}
#PurpleHaze {color:yellow;background-color:#9c27b0;}
#DeepPurple {color:#ffffff;background-color:#673ab7;}





#Default {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#BackinBlack {font-size:24px; font-family:Roboto; font-weight:bold; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#WhiteAlbum {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#RudolphRed {font-size:24px; font-family:Roboto; font-weight:bold; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#RubyTuesday {font-size:24px; font-family:Roboto; font-weight:bold; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#MellowYellow {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#YellowSubmarine {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#GreenTambourine {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#GreenGrass {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#MoodyBlue {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#PowderBlue {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#BlueBayou {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#Aqualung {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#PurpleHaze {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#DeepPurple {font-size:24px; font-family:Roboto; font-weight:300; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}




img#Default, img#BackinBlack, img#RudolphRed, img#RubyTuesday, img#MellowYellow, img#YellowSubmarine, img#GreenTambourine, img#GreenGrass, img#MoodyBlue, img#PowderBlue, img#BlueBayou, img#Aqualung, img#PurpleHaze, img#DeepPurple{
max-width:100%; max-height:350px; display:block; text-align:center; margin:0px auto; padding:1px;
-webkit-border-radius: 25px 25px 25px 25px;
-moz-border-radius: 25px 25px 25px 25px;
-khtml-border-radius: 25px 25px 25px 25px;
border-radius: 25px 25px 25px 25px;
-webkit-box-shadow: 0px 6px 6px #DDDDDD;
-moz-box-shadow: 0px 6px 6px #DDDDDD;
box-shadow: 0px 6px 6px #DDDDDD;
}







@media only screen and (max-width: 300px) {
body{font-size:18px;}
}


@media only screen and (max-width:854px){

body{font-size:18px;}

.col-16#album{width:100%; border:0px solid red; padding:1% 1%; margin:0px; font-weight:normal; font-style:normal; text-align:center; float:left;}

div.col-16.albumimgbig span.title{border:0px solid #000000; width:100%; padding:0px; margin:0px; font-size:28px; font-weight:normal; font-style:normal; text-align:center; text-transform:Capitalize; display:block; float:left; background:#ffffff;}

form.col-16.album_cover span.col-16.title{border:00px solid yellow; font-size:24px; text-transform:Capitalize;}

div.col-4 span.col-16.title{border:00px solid blue; width:100%; padding:0px; margin:0px; font-size:14px; font-weight:normal; font-style:normal; text-align:center; text-transform:Capitalize; display:block; float:left; background:transparent;}

span.title{border:02px solid red; width:100%; padding:0px; margin:0px; font-size:14px; font-weight:normal; font-style:normal; text-align:center; text-transform:Capitalize; display:block; float:left; background:transparent;}

span.ztitle{border:02px solid blue; width:100%; padding:0px; margin:0px; font-size:18px; font-weight:normal; font-style:normal; text-align:center; text-transform:Capitalize; display:block; float:left; background:transparent;}

}