/* GENERAL STYLES*/

ul { list-style-type: none; }

ul, li, table, tr, td{
	padding:0;
	margin:0;
}
ul, li{
	list-style:none;
	padding:0;
	margin:0;
}

p{
	margin:0;
}

a:hover, a:focus {
    color:#000 !important
}

/* NEW PAGE STYLES*/

.mobile-content {
	display: none;
}

.page {
	height:100vh;
	width:100%;
	/*min-width:350px;
	min-height:500px;*/
}

.coll_1, .coll_2, .coll_3, .coll_4, .coll_5, .coll_6, .coll_7, .coll_8, .coll_9, .coll_10, .coll_11, .coll_12, .coll_13, .coll_14, .coll_15, .coll_16 {
    float: left;
    height: calc(25vh - 15px);
    line-height: 23vh;
    min-height: auto;
    width: 12.5%;
}
.coll_1 { background-color:#ffe500; }
.coll_2 { background-color:#e5007e; }
.coll_3 { background-color:#864694; }
.coll_4 { background-color:#f3928b; }
.coll_5 { background-color:#fff; }
.coll_6 { background-color:#008f89; }
.coll_7 { background-color:#2baee6; }
.coll_8 { background-color:#aec90c; }
.coll_9 { background-color:#f7f4eb; }
.coll_10 { background-color:#33a836; }
.coll_11 { background-color:#e40051; }
.coll_12 { background-color:#383431; }
.coll_13 { background-color:#77b72b; }
.coll_14 { background-color:#0060ac; }
.coll_15 { background-color:#e5007e; }
.coll_16 { background-color:#f29200; }

.img_circo_logo {
	padding:20px;
	max-width:15%;
}

.left_follow {
	float:left;
	margin:18px 0;
}
.left_follow li{
	float:left;
	margin:0 4px 0 3px;
}

.left_follow a {
	background: transparent url(../img/follow.png) 0 0 no-repeat; 
}
.left_follow .facebook a {
	background-position:-14px -17px; 
	display:block;
	height:25px;
	width:25px;	
}
.left_follow .twiter a {
	background-position:-43px -17px; 
	display:block;
	height:25px;
	width:25px;	
}
.left_follow .clowd a {
	background-position:-77px -17px; 
	display:block;
	height:25px;
	width:55px;	
}
.left_follow .song a {
	background-position:-133px -17px; 
	display:block;
	height:25px;
	width:25px;	
}
.left_follow .spoti a {
	background-position:-164px -17px; 
	display:block;
	height:25px;
	width:25px;	
}
.left_follow .insta a {
	background-position:-195px -17px; 
	display:block;
	height:25px;
	width:25px;	
}
.left_follow .cloud2 a {
   background-position: -225px -17px;
    display: block;
    height: 25px;
    width: 43px;	
}
.left_follow .icon7 a {
    background-position: -278px -17px;
    display: block;
    height: 25px;
    width: 35px;
}

/* MENU STYLES */

.menu ul {
display: block;
margin-right: 15px;
    
}
.menu li {
	float:left;
}
.menu li a{
display: inline-block;
text-align: center;
padding: 12px 0px;
text-decoration: none;
margin: 0 12px;
}

.mosaic_page {
    text-align:center;
}

.mosaic_page img{
    max-width: 85%;  
}

.circo_content {
    overflow: hidden;
}

.footer{
    position:absolute;
    bottom:0;
    width:100%;
    background: #fff; 
} 

.footer_menu a{
    font-family: Oswald; 
    color:#7e7e7e; 
    font-size:18px;
    text-transform:uppercase;
}

.footer_menu a.active{
    border-bottom:3px solid #ff2b2a;
}

.footer_menu {
    float:right;
}

.modal-dialog {
    margin: 20vh auto !important;
}

.modal-content {
    border-radius: 0 !important
}

.modal-header {
    border:0 !important; 
    font-family: Oswald; 
    font-size:18px;
    text-transform:uppercase; 
    padding: 20px 20px 5px !important;
}

.modal-body input {
    border-radius:0;
    margin-bottom:10px;
     box-shadow:inset 0 0 0 transparent !important;
    -moz-box-shadow:inset 0 0 0 transparent !important;
    -webkit-box-shadow:inset 0 0 0 transparent !important;
    padding:10px;
    border:1px solid #e4e4e4;
}

.modal-body {
   padding: 10px 20px 0 !important;
}
.modal-body textarea {
    border-radius:0;
    margin-bottom:10px;
     box-shadow:inset 0 0 0 transparent !important;
    -moz-box-shadow:inset 0 0 0 transparent !important;
    -webkit-box-shadow:inset 0 0 0 transparent !important;
    padding:10px;
    border:1px solid #e4e4e4;
	resize: none;
}
.modal-body button {
    border-radius:0;
    margin-bottom:10px;
     box-shadow:inset 0 0 0 transparent !important;
    -moz-box-shadow:inset 0 0 0 transparent !important;
    -webkit-box-shadow:inset 0 0 0 transparent !important;
    padding:10px;
}

.send_mesage {
width: 100%;
background: #ff2b2a !important;
color: #fff !important;
border: 0 !important;
font-family: Oswald;
text-transform: uppercase;
padding: 10px !important;
font-size: 16px !important;
    border-radius: 0 !important;
}

.modal-footer {
    border:0 !important;
    padding: 5px 20px 15px !important;
}

.modal-dialog {
    width: 500px !important; 
}

.modal-backdrop.in {
    filter: alpha(opacity=0);
    opacity: .0 !important;
}

.nav::before {
    display: inline !important;}
	
	
	.mosaic_page_iner {
height: calc(100vh - 50px);
}

.footer {
	height:62px;
}

.modal-content {
	box-shadow:none !important;
	 border: 0 !important;
}

.open_modal {
	display:block !important;
}
.open_modal .close{
	display:none !important;
}


	
@media (max-width: 768px) {

.desktop-content {
	display: none;
}

.mobile-content {
	display: inline;
}
	
.coll_1, .coll_2, .coll_3, .coll_4, .coll_5, .coll_6, .coll_7, .coll_8, .coll_9, .coll_10, .coll_11, .coll_12, .coll_13, .coll_14, .coll_15, .coll_16 {
	width: 33.3%;
	float:left;
	height: calc(25vh - 25px) !important;
	min-height:auto !important;
	line-height:20vh !important;
    /*line-height: 23vh;*/
} 


    
.mosaic_page img {
    max-width: 70%;
}

.left_follow {
    display: block;
    float: none;
    height: 25px;
    margin: 15px auto;
    width: 315px;
}
    
    .footer_menu {
    float: none;
    clear: both;
    text-align: center;
}
    
    .nav {
    width: 300px;
    margin: 0 auto;
}

.modal-header {
    border-bottom: 1px solid #e5e5e5;
    padding: 21px 20px 15px !important; 
}
    
.modal-dialog {
   margin: 15px auto !important;
    padding: 0 15px !important; 
    width: 100% !important;
}
    
    .menu li {
    width: 33%;
}

.mosaic_page_iner {
height: calc(100vh - 100px);
}

.footer {
	height:107px;
}

.modal-content {
 height: calc(100vh - 132px);
min-height: 400px; 
}

.modal-body input {
height: 8vh;}

    
} 