/* Copyright (C) YOOtheme GmbH, Peacock Idea Inc. */

/* ========================================================================
Use this file to add Layout CSS easily:
    - Grid
    - Panel
    - Block
    - Article
    - Comment
    - Utility
    - Flex
    - Cover
========================================================================== */

/* Sub-object `uk-article-title`
 ========================================================================== */
.uk-article-title {
    text-align: center;
    color: #80b13e;
}

/* Sub-object: `uk-panel-title`
 ========================================================================== */
.uk-panel-title:after {
    content: "";
    display: block;
    border-bottom: 7px double #cc6678;
}

/*
 * Toolbar
 */

.tm-toolbar {
    color: #4d3f63;
    font-size: 18px;
    line-height: 20px;
}
/*
 * Top-a Top-B
 */
.space-back {
    background: rgba(77,63,99,1);
    background: -moz-linear-gradient(left, rgba(77,63,99,1) 0%, rgba(77,63,99,1) 3%, rgba(143,163,65,1) 30%, rgba(65,102,134,1) 78%, rgba(91,154,227,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(77,63,99,1)), color-stop(3%, rgba(77,63,99,1)), color-stop(30%, rgba(143,163,65,1)), color-stop(78%, rgba(65,102,134,1)), color-stop(100%, rgba(91,154,227,1)));
    background: -webkit-linear-gradient(left, rgba(77,63,99,1) 0%, rgba(77,63,99,1) 3%, rgba(143,163,65,1) 30%, rgba(65,102,134,1) 78%, rgba(91,154,227,1) 100%);
    background: -o-linear-gradient(left, rgba(77,63,99,1) 0%, rgba(77,63,99,1) 3%, rgba(143,163,65,1) 30%, rgba(65,102,134,1) 78%, rgba(91,154,227,1) 100%);
    background: -ms-linear-gradient(left, rgba(77,63,99,1) 0%, rgba(77,63,99,1) 3%, rgba(143,163,65,1) 30%, rgba(65,102,134,1) 78%, rgba(91,154,227,1) 100%);
    background: linear-gradient(to right, rgba(77,63,99,1) 0%, rgba(77,63,99,1) 3%, rgba(143,163,65,1) 30%, rgba(65,102,134,1) 78%, rgba(91,154,227,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d3f63', endColorstr='#5b9ae3', GradientType=1 );
}
.space-back-elem {
    background-image: url(../images/stars-2.png), url(../images/stars-1.png), url(../images/clouds.png);
    background-position: right bottom, left top, center top;
    background-repeat: repeat, repeat, repeat;
    animation: animatedclouds 60s linear infinite;
}
@keyframes animatedclouds {
	from { background-position: center bottom, center top, left top; }
	to { background-position: center top, center bottom, right top; }
}

.tm-test-back {
    background-color: rgba(255, 255, 255, 0.5);
    padding: 25px 15px 5px 15px;
    font-size: 30px;
        
}
/*
 * Content
 */
.tm-content {
    background: rgba(255, 255, 255,0.5) url("../images/fondo_cohete.png") repeat-y top center;
}
/*
 * Asi es Barrilete
 */
.tm-marco-blue {
    border: 5px solid #5c9bcd;
    margin: 40px 0 0 -120px;
    padding: 60px 60px 60px 160px;
}
.tm-marco-blue-2 {
    border: 5px solid #5c9bcd;
    padding: 60px;
}
.tm-horizontal-padding{
    padding-left: 12%;
    padding-right: 12%;
}

/*
 * bottom a - footer
 */
.green-back {
    background-color: #b683a1;
    color: #fff;
}


/* ========================================================================
   Responsive
 ========================================================================== */
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (max-width : 767px) {
/* Styles */
    .tm-marco-blue {
        margin: 20px 0;
        padding: 30px;
    }
    .tm-marco-blue-2 {
        padding: 30px;
        margin: 5px 0;
    }
    .tm-horizontal-padding{
        padding-left: 0;
        padding-right: 0;
    }
}
/* Tablets (portrait and landscape) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) {
/* Styles */
    .tm-horizontal-padding{
        padding-left: 1%;
        padding-right: 1%;
    }
    .tm-marco-blue {
        margin: 15px 0 0 -65px;
        padding: 30px 20px 30px 70px;
    }
    .tm-marco-blue-2 {
        padding: 40px;
    }
}
/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1025px) and (max-width : 1223px) {
/* Styles */
    .tm-horizontal-padding{
        padding-left: 5%;
        padding-right: 5%;
    }
    .tm-marco-blue {
        margin: 40px 0 0 -80px;
        padding: 40px 40px 40px 100px;
    }
}