/*FOOTER****************************/

.primaryContainer {
    height: auto;
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    width: 100%;
    width: 768px;
    background-color: #011d25;
}

.wrapper_footer {
	width: 100%;
	max-width: 768px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	background-color: #002b37;
	background-image: url("../art/background.jpg");
	background-attachment: s;
	-webkit-background-size: 120%;
	background-size: 120%;
	background-position: -80px 200px;
	background-repeat: no-repeat no-repeat;
	padding-top: 0px;
	margin-top: 0px;
}

.wrapper_cols {
	width: 768px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

.find_out {
	margin-top: 20px;
	margin-bottom: 10px;
}

.wrapper_credit {
	width: 320px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	margin-top: 10px;
}

.icon {
	width: 111px;
	text-align: center;
	margin: 0 auto 10px;
	padding: 0;
}

.name {
	width: 300px;
	text-align: center;
	float: none;
	margin: 0 auto 45px;
	padding: 0;
}

.col1 {
	width: 200px;
	float: left;
	text-align: left;
	margin-left: 30px;
	margin-right: 10px;
}

.col2 {
	width: 300px;
	float: left;
	text-align: left;
	margin-right: 20px;
}

.col3 {
	width: 180px;
	float: left;
	text-align: left;
}

.wrapper_social {
	width: 260px;
	margin: 10px auto 30px;
	text-align: center;
}

.share {
	margin-bottom: 15px;
}

.social {
	float: left;
	width: 55px;
	margin-bottom: 20px;
}

.social_last {
	float: left;
	width: 43px;
	margin-bottom: 20px;
}

.plate {
	float: left;
	width: 21%;
	margin-top: 0;
	margin-right: 1%;
	margin-bottom: 30px;
}

.plate_first {
	margin-left: 6%;
}

.collections {
	text-align: left;
	width: 88%;
	margin: 25px auto 10px;
}

#alphapodtablet_hype_container {
	width: 100%;
	margin: 0 auto 0px;
	background-color: #002b37;
	background-image: url("../art/loader.png");
	background-attachment: scroll;
	-webkit-background-size: 100%;
	background-size: 100%;
	background-position: 0px 240px;
	background-repeat: no-repeat no-repeat;
}

/*SHARE THIS********************************/
.st_facebook_custom {
	width: 43px;
	height: 43px;
	height: 43px;
	background: url(../art/btn_fbk@2x.png) no-repeat;
	-webkit-background-size: 100%;
	background-size: 100%;
	float: left;
	margin-right: 10px;
	margin-bottom: 30px;
} 

.st_twitter_custom {
	width: 43px;
	height: 43px;
	height: 43px;
	background: url(../art/btn_twitter@2x.png) no-repeat;
	-webkit-background-size: 100%;
	background-size: 100%;
	float: left;
	margin-right: 10px;
	margin-bottom: 30px;
} 

.st_tumblr_custom {
	width: 43px;
	height: 43px;
	height: 43px;
	background: url(../art/btn_tumblr@2x.png) no-repeat;
	-webkit-background-size: 100%;
	background-size: 100%;
	float: left;
	margin-right: 10px;
	margin-bottom: 30px;
}

.st_pinterest_custom {
	width: 43px;
	height: 43px;
	height: 43px;
	background: url(../art/btn_pinterest@2x.png) no-repeat;
	-webkit-background-size: 100%;
	background-size: 100%;
	float: left;
	margin-right: 10px;
	margin-bottom: 30px;
}

.st_stumbleupon_custom {
	width: 43px;
	height: 43px;
	height: 43px;
	background: url(../art/btn_stumble@2x.png) no-repeat;
	-webkit-background-size: 100%;
	background-size: 100%;
	float: left;
	margin-right: 0px;
	margin-bottom: 30px;
}

.sketch1, .sketch2, .sketch3, .sketch4, .sketch5 {
	float: left;
	margin-bottom: 20px;
}

.sketch1 {
	width: 36.2%;
	margin-right: 5%;
	margin-left: 8%;
}

.sketch2 {
	width: 40.4%;
}

.sketch3 {
	width: 36%;
	margin-right: 1%;
	margin-left: 8%;
}

.sketch4 {
	width: 48.6%;
}

.sketch5 {
	width: 42%;
	margin-left: 28%;
}


/*FORM ***********************************/
input, textarea {
    /* To make sure that all text fields have the same font settings
       By default, textareas have a monospace font */
    font: 1em sans-serif;

    /* To give the same size to all text field */
    width: 300px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    /* To harmonize the look & feel of text field border */
    border: 1px solid #999;
}

input:focus, textarea:focus {
    /* To give a little highlight on active elements */
    border-color: #000;
}

.button {
    /* To position the buttons to the same position of the text fields */
    padding-left: 90px; /* same size as the label elements */
}
button {
    /* This extra margin represent roughly the same space as the space
       between the labels and their text fields */
    margin-left: .5em;
}


/* RESPONSIVE DESKTOP -------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------- */


/*LARGE SCREENS*/
@media only screen and (max-width:3500px) and (min-width:1700px) {
	
	.primaryContainer {
	    background-position: 0% -50px;
	}
	
	.matrix_logo {
		margin-bottom: 10px;
		margin-top: 3.9%;
	}
	
	.matrix_logo_ch {
	    margin-bottom: 2%;
	    background: url("../art/btn_fbk.png") no-repeat scroll left top transparent;
	}

}


/* RESPONSIVE MOBILE -------------------------------------------------------------------------
-----------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------- */


@media only screen and (max-device-width:750px) and (min-device-width:320px) {

/*TO TEST ON DESKTOP USE THIS----------------------------*/
/*@media only screen and (max-width:750px) and (min-width:320px) {*/

.wrapper_footer, .wrapper_footer_art {
	min-width: 320px;
	padding-bottom: 25px;
}

.footer_col1 {
	width:90%;
	margin-right: auto;
	float: none;	
	padding-top: 10px;
	margin-left: auto;
	text-align: center;
}

.footer_col2 {
	width:105px;
	margin-right: auto;
	float: none;
	text-align: center;
	margin-left: auto;
	
}

.footer_col3 {
	width:90%;
	margin-right: auto;
	float: none;
	text-align: center;
	margin-left: auto;
}

.matrix_logo_small {
    float: none;
    width: 90%;
    max-width: 600px;
    height: auto;
	margin: 0 auto 19px;
	clear: none;
}

.matrix_logo_ch_small {
    float: none;
    width: 90%;
    max-width: 600px;
    height: auto;
	margin: 1% auto 35px;
	clear: none;
}

.icon_fixed {
	width: 47px;
	margin-bottom: 35px;
	margin-right: auto;
	text-align: center;
	float: left;
}

.social_mobile_right {
	margin-left: 10px;
}

}