@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600);

body {
	margin: 0;
	width: 100%;
	background: url(../imgs/bg.png) no-repeat fixed;
	color: rgb(255, 255, 255);
	font-family: 'source sans pro';
	background-size:cover;
	
}

/*ICON FONT FACE*/

@font-face {
	font-family: 'icomoon';
	src:url('fonts/icomoon.eot?5dq10k');
	src:url('fonts/icomoon.eot?#iefix5dq10k') format('embedded-opentype'),
		url('fonts/icomoon.woff?5dq10k') format('woff'),
		url('fonts/icomoon.ttf?5dq10k') format('truetype'),
		url('fonts/icomoon.svg?5dq10k#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-om:before {
	content: "\e600";
}


header,
footer,
#content {
    clear: both;
}
a {
    text-decoration: none;
    color: inherit
}
header {
    position: relative;
    display: block;
    width: 100%;
    height: 90px;
}

header,
footer {
    background: rgb(240, 249, 255);
    /* Old browsers */
    
    background: -moz-radial-gradient(center, ellipse cover, rgba(240, 249, 255, 1) 0%, rgba(93, 79, 173, 1) 0%, rgba(45, 46, 131, 1) 100%);
    /* FF3.6+ */
    
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(240, 249, 255, 1)), color-stop(0%, rgba(93, 79, 173, 1)), color-stop(100%, rgba(45, 46, 131, 1)));
    /* Chrome,Safari4+ */
    
    background: -webkit-radial-gradient(center, ellipse cover, rgba(240, 249, 255, 1) 0%, rgba(93, 79, 173, 1) 0%, rgba(45, 46, 131, 1) 100%);
    /* Chrome10+,Safari5.1+ */
    
    background: -o-radial-gradient(center, ellipse cover, rgba(240, 249, 255, 1) 0%, rgba(93, 79, 173, 1) 0%, rgba(45, 46, 131, 1) 100%);
    /* Opera 12+ */
    
    background: -ms-radial-gradient(center, ellipse cover, rgba(240, 249, 255, 1) 0%, rgba(93, 79, 173, 1) 0%, rgba(45, 46, 131, 1) 100%);
    /* IE10+ */
    
    background: radial-gradient(ellipse at center, rgba(240, 249, 255, 1) 0%, rgba(93, 79, 173, 1) 0%, rgba(45, 46, 131, 1) 100%);
    /* W3C */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f0f9ff', endColorstr='#2d2e83', GradientType=1);
    /* IE6-9 fallback on horizontal gradient */
}

 


header h2 {
    line-height: 90px;
    font-weight: 300;
    text-align: center;
    margin: 0px;
    padding: 0px;
}
header h2 span {
    font-size: 85px;
    margin-left: 20px;
    margin-right: 20px;
    vertical-align: -29px;
}
#content {
    display: block;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    top: 12px;
    min-height: calc( 100vh - 140px);
    width: 961px;
    height: auto;
}
.linhaIncompleta {
    display: block;
    height: auto;
    margin-left: auto;
    margin-right: auto
}
.um {
    width: 185px
}
.dois {
    width: 382px
}
.tres {
    width: 573px;
}
.quatro{width: 764px;}
.square {
    display: block;
    width: 185px;
    height: 185px;
    float: left;
    background: rgba(0, 204, 0, 0);
    overflow: hidden;
    margin: 3px 3px 12px 3px;
}
.title,
.title2 {
    position: relative;
    display: block;
    width: 185px;
    height: 46px;
    overflow: hidden;
    text-transform: uppercase;
    text-align: center;
    font-weight: 400;
    font-size: 14px;
    background: rgba(153, 0, 204, .5)
}
.title {
    line-height: 46px;
}
.title2 {
    line-height: 23px;
}

.titlePromo{background: rgba(36, 162, 213, .5)}

.square img {
    position: relative;
    display: block;
    width: 185px;
    height: 135px;
    top: 4px;
}
.faderLink {
    display: block;
    position: relative;
    top: -131px;
    width: 185px;
    height: 135px;
}
.pink {
    background: rgba(36, 162, 213, 1);
}
.blue {
    background: rgba(36, 162, 213, 1);
}
.pink,
.blue {
    opacity: 0;
    transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    -webkit-transition: opacity .2s ease-in-out;
}
.pink:hover,
.blue:hover {
    opacity: .4;
}
footer {
    position: relative;
    display: block;
    width: 100%;
    height: 20px;
    top: 30px;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
}

/*PÀGINAS*/

.pageTitle{ display:block; min-width:100%; height:46px; line-height:46px; overflow:hidden; text-align:center;text-transform: uppercase; background: rgba(153, 0, 204, .5)}
.pageContent{ display:block; position:relative; min-width:100%; height:auto; top:6px; overflow:hidden; background:#000066 }
.pageContent p{font-size:16px; margin:20px 10px 10px 10px;}
.pageContent img{ max-width:95%; height:auto}

/*MEDIA QUERY'S*/

@media only screen and (max-width: 1000px) {
    #content, .um , .dois, .tres, .quatro {
        width: 573px;
    }
	/*header,
	footer {
    background: #000066;}*/
}
@media only screen and (max-width: 650px) {
   #content, .um , .dois, .tres, .quatro {
        width: 382px;
    }

	/*header,
	footer {
    background: #000066;}*/
}
@media only screen and (max-width: 450px) {
    #content, .um , .dois, .tres, .quatro {
        width: 191px;
    }
	.pageContent p{font-size:14px;}
	header{height: 80px;}
    header h2 {
        line-height: 81px;
        font-weight: 300;
        font-size: 16px
    }
    header h2 span {
        font-size: 60px;
        margin-left: 20px;
        margin-right: 20px;
        vertical-align: -20px
    }
	header,
	footer {
    background:#000066;}
	
	body {
	background: url(../imgs/bg.png) repeat;
		
}
	footer {

    font-size: 10px;
}
	
}
}