/* 
    Created on : Mar 7, 2016, 12:21:53 PM
    Author     : matheus
*/
*{
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    color: #dddddd;
    font-family: sans-serif;
}

h1 {
    display: block;
    font-family: serif;
    font-weight: bold;
    font-size: 1.5em;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(255,255,255,0.3);
}

.header {
    font-size: 2em;
    padding: 20px;
    text-align: center;
    color: white;
}

.index .content {
    background: none;
    color: #eeeeee;
    padding: 20px;
}
.post {
    float:left;
    width: 510px;
    margin: 0 auto;
    padding: 20px;
    margin: 0 20px 20px 0;
    background: rgba(0,0,0,0.4);
}
.post p.chamada {
    font-style: italic;
    line-height: 2em;
    text-indent: 0;
    color: #dddddd;
}
.post p {
    text-indent: 3em;
    text-align: justify;
    line-height: 1.6em;
}
.post .title {
    font-family: serif;
}
.imagem-inicial {
    float:left;
    width: 460px;
    margin: 0 auto;
    padding: 20px;
    margin: 0 20px 20px 0;
    text-align:center;
}
.comece, .login {
    width: 180px;
    text-align: center;
    display: block;
}
.preco {
    float: right;
    display: block;
    padding: 20px;
}
.comece p {
    margin-bottom: 0px;
}
.comece .rs {
    float:left;
    padding-top: 2.8em;
}
.comece .reais {
    font-size: 4em;
    font-weight: bold;
    float:left;
    color: #ffdd00;
    text-shadow: 1px 1px 2px black;
}
.comece .centavos {
    float:left;
    font-size: 1.9em;
    padding-top: 0.2em;
    font-weight: bold;
    color: #ffdd00;
    text-shadow: 1px 1px 2px black;
}
.comece .ao-mes {
    padding-top:2.8em;
    float: right;
}
.comece a {
    background: #22aa44;
    color: #f0f0f0;
    margin: 10px 0;
    font-size: 1.2em;
    padding: 12px 14px;
    font-weight: bold;
    border: 1px solid transparent;
    border-radius: 5px;
    cursor: pointer;
    border-bottom-color: #119933;
    border-right-color: #119933;
    border-top-color: #90e0b0;
    border-left-color: #90e0b0;
    text-decoration: none;
    display: inline-block;
}
.comece a:hover {
    background: #33bb55;
    color: white;
    box-shadow: 1px 1px 3px #119933;/*#44dd66;*/
}

.login {
    display: block;
    float: right;
    margin-top: 2em;
    background: rgba(255,255,255,0.5);
    border-radius: 6px;
    width: 180px;
    padding: 10px;
}
.login input {
    margin: 0 0 10px 0;
    padding: 6px 10px;
}
.login a {
    background: #2255aa;
    color: #f0f0f0;
    display: block;
    font-weight: bold;
    border: 1px solid transparent;
    border-radius: 5px;
    padding: 6px 10px;
    margin: 10px 0px;
    cursor: pointer;
    border-bottom-color: #113399;
    border-right-color: #113399;
    border-top-color: #90b0e0;
    border-left-color: #90b0e0;
    text-decoration: none;
}
.login a:hover {
    background: #3366cc;
    color: white;
    box-shadow: 1px 1px 3px #4477dd;
}
.login a span {
    margin-left: 0.5em;
    display: inline-block;
}

html {
    background: url('../imgs/background.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-height: 100%;
}
body {
    min-height:100%;
}


.rodape {
    text-align: center;
    padding:40px 0 10px 0;
    font-size: 10px;
}
.rodape a {
    color: white;
    padding: 10px;
    font-size: 14px;
}


@media(min-width: 850px) {
    .content, .header {
        max-width: 800px;
        margin: 0 auto;
    }
}

@media(max-width: 850px) {
    .comece {
        float:left !important;
    }
    
    .venda {
        width:100%;
        float:left;
    }
    
    .imagem-inicial {
        margin: 0 auto;
        float:none;
    }
}