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

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

}
html{ margin: 0px; padding: 0px;}
body{font-family: 'cooper_hewittbold'; font-size:14px; line-height:18px;position: relative; margin: 0px; padding: 0px; background: #c7e7e4; 
    width: 100%;  overflow: auto; color: #ff92ca}
img{ margin: 0px; padding: 0px; border: 0px;}
input{ position: relative; margin: 0px; padding: 0px}
a{ text-decoration: none;  color: inherit;  transition: all 0.5s ease;}
a:hover{ color: #cdb084; text-decoration: none; }
.img-fluid {
    display: block;
    height: auto;
    max-width: 100%;
}


#outer{  min-height: 618px; position: relative; overflow: hidden;}
.inner{ max-width: 1150px; width:100%; position: relative; margin: 0px auto 0px auto; text-align: center; }

.shadow{ -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0, 1);
-moz-box-shadow:    0px 3px 5px 0px rgba(0,0,0, 1);
box-shadow:         0px 3px 5px 0px rgba(0,0,0, 1);}

.shadow2{-webkit-box-shadow: 0px 0px 8px 0px rgba(50, 50, 50, 1);
-moz-box-shadow:    0px 0px 8px 0px rgba(50, 50, 50, 1);
box-shadow:         0px 0px 8px 0px rgba(50, 50, 50, 1);}
.shadow4{-webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 1);
-moz-box-shadow:    0px 0px 8px 0px rgba(0, 0, 0, 1);
box-shadow:         0px 0px 8px 0px rgba(0, 0, 0, 1);}
.shadow5{-webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.75);
-moz-box-shadow:    0px 2px 5px 0px rgba(0, 0, 0, 0.75);
box-shadow:         0px 2px 5px 0px rgba(0, 0, 0, 0.75);}
.sp20{ width: 100%; height: 20px; line-height: 20px; font-size: 20px; position: relative;}
 .sp40{ width: 100%; height: 40px; line-height: 40px; font-size: 40px; position: relative;}
 .sp60{ width: 100%; height: 60px; line-height: 60px; font-size: 60px; position: relative;}
 .sp80{ width: 100%; height: 80px; line-height: 80px; font-size: 80px; position: relative;}
 .sp100{ width: 100%; height: 100px; line-height: 100px; font-size: 100px; position: relative;}
.clear{ width: 100%; height: 0px; line-height: 0px; font-size: 0px; position: relative; clear: both;}

.top_bar{ width: 100%; position: relative; height: 20px; }
footer{ position: relative; width: 100%; min-height: 50px; background: #ff92ca; color: #ffffff; }
.copy{ font-family: 'cooper_hewittmedium'; position: relative; margin-top: 40px; font-size: 16px; line-height: 20px }
.main_ttl{ position: relative; font-size: 60px; line-height: 65px; text-transform: uppercase; }
.main_sttl{ position: relative; font-size: 31px; line-height: 35px; text-transform: uppercase; }
.more{ position: relative; font-size: 30px; line-height: 35px; }

.item{ width: 205px; height: auto; position: relative; float: left; border: 5px solid #ff92ca; float: left; margin: 10px 10px 10px 10px; }
.item .pic{ width: 100%; height: auto; position: relative; display: block; }
.item .pic img{ width: 100% !important; height: auto !important; position: relative; display: block; }
.gallery{ margin-top: 30px; }
.gallery_items{ position: relative; width: 100%; max-width: 680px; margin: 0px auto }
.gallery_ttl{position: relative; font-size: 60px; line-height: 65px; text-transform: uppercase; }
.right_side{ position: absolute; top:0px; right: 0px; width: 220px; }
.album_ttl{ position: relative; font-size: 16px; line-height: 22px; margin-top: -10px; }
.buy img{ position: relative; margin-top: 10px }
.content{ margin-top: 15px; position: relative; }
.top_bar{ width: 100%; position: relative; height: 120px; }
.logo{ position: absolute; top:10px; left: 20px }
.enter_web{ position: absolute; top:50px; left: 0px; width: 100%; text-align: center; font-size: 18px; line-height: 24px; }
.connect_top{ position: absolute; top:40px; right: 10px; text-align: left; font-size: 25px; line-height: 30px; }
.connect_top a{ display: inline-block; vertical-align: middle; margin: 0px 0px 0px 8px; }
.connect_top iframe{ display: inline-block; vertical-align: middle; margin: 0px 0px 0px 8px; }
.note{ position: relative; margin:10px auto 0px auto; width: 95%; max-width: 600px; font-family: 'Lato',sans-serif; font-size: 12px; line-height: 15px; color: #000000 }

.mailing-list-wrapper {
    background: #ff92ca none repeat scroll 0 0;
    padding-left: 14px;
    padding-right: 14px;
    padding-bottom: 20px;
}
.mailing-list-outer-wrapper {
    border: 0 none;
    box-sizing: border-box;
    
    max-width: 309px;
    margin: 40px auto 0px auto;
    padding-bottom: 20px;
    position: relative;
    top: auto;
    width: auto;
}
.mlist-header {
    color: #fff;
    font-family: "cooper_hewittbold";
    font-size: 14px;
}
input#email {
    background: #fff none repeat scroll 0 0;
    border: 2px solid #fff;
    box-sizing: border-box;
    color: #ff92ca;
    font-family: "cooper_hewittbook";
    height: 37px;
    line-height: 37px;
    margin: 10px 0px 0px 0px;
    padding-left: 12px;
    width: 147px;
}
.mlist-field {
    display: inline-block;
    margin: 0;
    padding: 0;
}
.mailing-list-header {
    color: #fff;
    font-family: "cooper_hewittbold";
    font-size: 14px;
    font-weight: normal;
    line-height: 20px;
    padding: 20px 0px 0px 0;
}
input.submit {
    background: #ff92ca none repeat scroll 0 0;
    border: 3px solid #fff;
    color: #ffffff;
    cursor: pointer;
    font-family: "cooper_hewittbold";
    font-size: 16px;
    height: 37px;
    outline: medium none;
    text-transform: uppercase;
    width: 147px;
    margin-top: 15px;
    position: relative;
}
input.submit:hover {
    background: #ffffff none repeat scroll 0 0;
    color: #ff92ca;
}

.widget{ position: relative; width: 100%; max-width: 648px; margin: 0px auto; background: #ff92ca; border: 4px solid #ff92ca;}
.widget img{ position: relative; width: 100% }
.widget_btns{ position: relative; float: right; text-align: right; color: #ffffff; }
.colors{ position: relative; float: left; text-align: left; top:0px; max-width: 440px; }
.colors ul{ list-style: none; margin: 0px; padding: 0px; }
.colors ul li{ list-style: none; position: relative; display: inline-block; vertical-align: middle; width: 24px; height: 24px; border:2px solid #ff92ca; box-sizing: content-box !important}
.colors ul li.sel{ border: 2px solid #ff0000; }
.colors ul li:hover{ border: 2px solid #ffffff; }
.colors ul li a{ width: 100%; height: 100%; display: block; }
.widget_bar{ position: relative; padding: 0px 0px 14px 0px; }
.save_btn{ position: relative; display: inline-block; vertical-align: middle; width: 152px; text-align: center; color: #ffffff; border: 2px solid #ffffff; height: 35px; }
.save_btn a{ color: #ffffff;text-decoration: none; font-size: 18px; line-height: 35px; }
.rotate_btn{ position: relative; display: inline-block; width: 35px; vertical-align: middle; text-align: center; color: #ffffff; border: 2px solid #ffffff; height: 35px; }
.rotate_btn a{ color: #ffffff;text-decoration: none; font-size: 18px; line-height: 35px; }
.info_txt{ color: #ffffff; text-align: right; font-size: 13px; line-height: 18px; font-weight: 300; font-family: Lato}
.info_txt a {text-decoration: underline;color:#ffffff;}


@media handheld, only screen and (max-width: 800px) {

	.connect_top{ display: none; }
	.share_top{ display: none; }
	.inner{ width: 95% }
	.right_side{ position: relative; width: 95%; margin: 10px auto 0px auto; }
    .album_cover{ position: relative; display: inline-block; vertical-align: middle; }
    .album_info{ position: relative; display: inline-block; vertical-align: middle; }
    .item{ width: 29%; margin:1%; position: relative; display: inline-block; vertical-align: top; float: none; }
    .gallery_ttl{ font-size: 50px; line-height: 55px }
    .top_bar{ height: inherit; }
    .enter_web{ position: relative; margin:10px 0px 0px 0px; top:0px; }
    .logo{ position: relative; text-align: center; top:0px; left: 0px; }

	}

    @media handheld, only screen and (max-width: 600px) {

        .item{ width: 46%; margin:1%; position: relative; display: inline-block; vertical-align: top; float: none; }
    

    }