body,html {height: 100%;min-height: 100%;}
@font-face {
    font-family: 'socicon';
    src: url('font/socicon-webfont.eot');
    src: url('font/socicon-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/socicon-webfont.woff') format('woff'),
         url('font/socicon-webfont.ttf') format('truetype'),
         url('font/socicon-webfont.svg#sociconregular') format('svg');
    font-weight: normal;font-style: normal;text-transform: initial;}
.socicon {position: relative;top: 1px;display: inline-block;font-family: 'socicon';font-style: normal;font-weight: normal;line-height: 1;-webkit-font-smoothing: antialiased;}
.socicon:empty{width: 1em;}
.socicon-twitter:before { content: "a"; }
.socicon-facebook:before { content: "b"; }
.socicon-google:before { content: "c"; }
.socicon-pinterest:before { content: "d"; }
.socicon-foursquare:before { content: "e"; }
.socicon-yahoo:before { content: "f"; }
.socicon-skype:before { content: "g"; }
.socicon-yelp:before { content: "h"; }
.socicon-feedburner:before { content: "i"; }
.socicon-linkedin:before { content: "j"; }
.socicon-viadeo:before { content: "k"; }
.socicon-xing:before { content: "l"; }
.socicon-myspace:before { content: "m"; }
.socicon-soundcloud:before { content: "n"; }
.socicon-spotify:before { content: "o"; }
.socicon-grooveshark:before { content: "p"; }
.socicon-lastfm:before { content: "q"; }
.socicon-youtube:before { content: "r"; }
.socicon-vimeo:before { content: "s"; }
.socicon-dailymotion:before { content: "t"; }
.socicon-vine:before { content: "u"; }
.socicon-flickr:before { content: "v"; }
.socicon-500px:before { content: "w"; }
.socicon-instagram:before { content: "x"; }
.socicon-wordpress:before { content: "y"; }
.socicon-tumblr:before { content: "z"; }
.socicon-blogger:before { content: "A"; }
.socicon-technorati:before { content: "B"; }
.socicon-reddit:before { content: "C"; }
.socicon-dribbble:before { content: "D"; }
.socicon-stumbleupon:before { content: "E"; }
.socicon-digg:before { content: "F"; }
.socicon-envato:before { content: "G"; }
.socicon-behance:before { content: "H"; }
.socicon-delicious:before { content: "I"; }
.socicon-deviantart:before { content: "J"; }
.socicon-forrst:before { content: "K"; }
.socicon-playstore:before { content: "L"; }
.socicon-zerply:before { content: "M"; }
.socicon-wikipedia:before { content: "N"; }
.socicon-apple:before { content: "O"; }
.socicon-flattr:before { content: "P"; }
.socicon-github:before { content: "Q"; }
.socicon-chimein:before { content: "R"; }
.socicon-friendfeed:before { content: "S"; }
.socicon-newsvine:before { content: "T"; }
.socicon-identica:before { content: "U"; }
.socicon-bebo:before { content: "V"; }
.socicon-zynga:before { content: "W"; }
.socicon-steam:before { content: "X"; }
.socicon-xbox:before { content: "Y"; }
.socicon-windows:before { content: "Z"; }
.socicon-outlook:before { content: "1"; }
.socicon-coderwall:before { content: "2"; }
.socicon-tripadvisor:before { content: "3"; }
.socicon-appnet:before { content: "4"; }
.socicon-goodreads:before { content: "5"; }
.socicon-tripit:before { content: "6"; }
.socicon-lanyrd:before { content: "7"; }
.socicon-slideshare:before { content: "8"; }
.socicon-buffer:before { content: "9"; }
.socicon-rss:before { content: ","; }
.socicon-vkontakte:before { content: ";"; }
.socicon-disqus:before { content: ":"; }
.socicon-houzz:before { content: "+"; }
.socicon-mail:before { content: "@"; }
.socicon-patreon:before { content: "="; }
.socicon-paypal:before { content: "-"; }
.socicon-playstation:before { content: "^"; }
.socicon-smugmug:before { content: "¨"; }
.socicon-swarm:before { content: "$"; }
.socicon-triplej:before { content: "*"; }
.socicon-yammer:before { content: "&"; }
.socicon-stackoverflow:before { content: "("; }
.socicon-drupal:before { content: "#"; }
.socicon-odnoklassniki:before { content : ".";}
.socicon-android:before { content: "_"; }
.socicon-meetup:before { content: "]"; }
.socicon-persona:before { content: ")"; }

#container {height: 100%;background-repeat: no-repeat;background-size: cover;background-position: center;}
#container .row {height: 100%; min-height: 100%;}
#container .row .medium-offset-3 {display: table; height: 100%; padding: 0;}
/*
.image1 {background-image: url(../img/cloud2.jpg);}   - - - - - - - See data-interchange on index.html
.image2 {background-image: url(../img/cloud3.jpg);}   - - - - - - - See data-interchange on index2.html
.image3 {background-image: url(../img/cloud4.jpg);}   - - - - - - - See data-interchange on index3.html
*/

#wrapper {height: 100%;max-height: 100%; min-height:100%;overflow: hidden;width: 100%;max-width: 720px;float: none;margin: 0; padding: 0; display: block;}
#innerWrapper {height:100%;display: block;width: 100%;overflow: hidden;}
#wrapper .row {  height: calc(100% - 52px);min-height: calc(100% - 52px);padding:2rem 1rem 1rem;background: #FFF; background: rgba(255,255,255,0.9);}

.brand {text-align: center;}
.brand img {max-height: 80px;}

.terms {max-height: 200px; overflow: auto; border:1px solid #CCC; border-radius: 5px; padding: 15px; margin: 1.25rem 0; background-color: #FFF;}
.terms p {font-size: .8rem; color: #666;}
.terms p:last-child {margin-bottom: 0;}

#wrapper .row.footer { background-color: #333; padding: 0 10%; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px;}
#wrapper .row.footer .small-1 {padding: 0;}
#wrapper .row.footer .small-1.first {margin: 0 0 0 1.25rem;}
#wrapper .row.footer a {display: block;width: 100%;padding:.8rem 0;text-align: center; font-size: 1rem; font-family: "socicon"; color: #CCC;}
#wrapper .row.footer a:hover {color: #FFF;}
.copyright {font-size: .8rem; color:#666;margin:0;padding: 1rem 0;}

.login {margin: 1.25rem 0; background-color: #FFF;}
.login input[type=text],.login input[type=password] {border-radius: 3px;box-shadow: none;padding-top: 1rem;padding-bottom: 1.0625rem;height: 50px;}
.login form input[type=submit] {outline: none;}
.termsLink {display: block;text-align: center; margin: 1.25rem;}

.alert {margin: 1.25rem 0; background-color: #FFF;}
.alert h4 {text-align: center;border-bottom: 1px dotted #CCC;text-transform: uppercase;font-weight: 500;margin: 1.25rem auto 1rem;padding: 0 0 .3rem 0;width: 50%;}
.alert p {font-size: 1rem;color: #666; text-align: center;}

@media only screen and (min-width: 40.063em) {
	#wrapper {height: 80%;max-height: 80%; margin: 10% auto 0; display: table-cell;vertical-align: middle;}
	#innerWrapper {border-radius: 5px; height: auto;}
	#wrapper .row {height: auto; min-height: 0;padding:2rem 3rem 1rem;}
	#container .row .large-offset-3 {padding-left: 0.9375em;padding-right: 0.9375em;}
}