/*
 * Author: Piropixel
 * URL: http://www.piropixel.com
 * Project Name: Mutua Madrid Open
 * Version: 1.0
 */

/* 
=============================================================================
=============================================================================
   480px
============================================================================= 
============================================================================= 
*/

@media only screen and (min-width: 480px) {

/*.video {
    margin-bottom:70px;
    }

.video_wrapper iframe {
    border:solid 3px #ffffff;
    }*/

} /* === End 480px === */

/* 
=============================================================================
=============================================================================
   670px
============================================================================= 
============================================================================= 
*/

@media only screen and (min-width: 670px) {

/*.header .logo img {
    top:112px;
    max-width:15%;
    }

.video_wrapper iframe {
    border:solid 3px #ffffff;
    }*/

} /* === End 670px === */

/* 
=============================================================================
=============================================================================
   768px
============================================================================= 
============================================================================= 
*/

@media only screen and (min-width: 768px) {

/*.header .logo img {
    top:112px;
    max-width:15%;
    }

.video {
    margin-bottom:80px;
    }

.video_wrapper iframe {
    border:solid 4px #ffffff;
    }

.footer {
	padding-bottom:200px;
	}

.footer div {
	margin:0;
	}

.footer img {
	max-width:100%;
	}

.footer div:nth-child(1),
.footer div:nth-child(2) {
	border-right:solid 1px #505161;
	}*/


} /* === End 768px === */

/* 
=============================================================================
=============================================================================
   992px
============================================================================= 
============================================================================= 
*/

@media only screen and (min-width: 992px) {

/*.header .logo img {
    top:100px;
    max-width:100%;
    }

.video {
    margin-bottom:100px;
    }

.video_wrapper iframe {
    border:solid 5px #ffffff;
    }*/




} /* === End 992px === */


/* 
=============================================================================
=============================================================================
   1200px
============================================================================= 
============================================================================= 
*/

@media only screen and (min-width: 1200px) {

/*.video {
    margin-bottom:110px;
    }

.video_wrapper iframe {
    border:solid 6px #ffffff;
    }*/



} /* === End 1200px === */

/* 
=============================================================================
=============================================================================
   1400px 
=============================================================================
============================================================================= 
*/

@media only screen and (min-width: 1400px) {





} /* === End 1400px === */



/* 
=============================================================================
=============================================================================
   BOOTSTRAP 5 COLUMNAS 
=============================================================================
=============================================================================
*/

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
    }
 
.col-xs-15 {
    width: 20%;
    float: left;
    }
 
@media (min-width: 768px) {

.col-sm-15 {
    width: 20%;
    float: left;
    }
}
 
@media (min-width: 992px) {

.col-md-15 {
    width: 20%;
    float: left;
    }
}
 
@media (min-width: 1200px) {
.col-lg-15 {
    width: 20%;
    float: left;
    }
}

/* ==========================================================================
   breakpoint ms bootstrap ==================================================
============================================================================= */
/**
  * Custom Bootstrap 3 grid for 480-767px layout
  * Author: Iftakhar Hasan
  *
  * A new set of column classes (with class prefix .col-ms- ) for Bootstrap 3
  * to make Medium Small grids for supporting 480-767px
  *
  * This will push the default Bootstrap 3 Extra Small column (class prefix .col-xs- )
  * to support 1-479px instead of 1-767px
  */

.col-ms-1,
.col-ms-2,
.col-ms-3,
.col-ms-4,
.col-ms-5,
.col-ms-6,
.col-ms-7,
.col-ms-8,
.col-ms-9,
.col-ms-10,
.col-ms-11,
.col-ms-12 {
	position:relative; 
	padding-left:15px; 
	padding-right:15px;
	} 

@media (min-width: 480px) and (max-width: 767px) {
.container {max-width:748px;} 
.col-ms-1,
.col-ms-2,
.col-ms-3,
.col-ms-4,
.col-ms-5,
.col-ms-6,
.col-ms-7,
.col-ms-8,
.col-ms-9,
.col-ms-10,
.col-ms-11 {float:left;}
.col-ms-1 {width:8.33333333%;}
.col-ms-2 {width:16.66666667%;}
.col-ms-3 {width:25%;}
.col-ms-4 {width:33.33333333%;}
.col-ms-5 {width:41.66666667%;}
.col-ms-6 {width:50%;}
.col-ms-7 {width:58.33333333%;}
.col-ms-8 {width:66.66666667%;}
.col-ms-9 {width:75%;}
.col-ms-10 {width:83.33333333%;}
.col-ms-11 {width:91.66666667%;}
.col-ms-12 {width:100%;}
}